Bootstrap

前端表单传输数据,后端接收数据的流程

### 1.前端表单传输数据,后端接收数据流程

一、前端操作:

 1.外置的JS内:(先设置好后端路径,根据需求进行前端编写)

```

// 统一请求路径前缀在libs/axios.js中修改

import {

    getRequest,

    putRequest,

    postRequest,

    deleteRequest,

  } from "@/libs/axios";

  // 测试,params代表需要传入的参数

  export const testTask = (params) => {

    return deleteRequest(`/task/listing/test`,params);//在此处设置好,前端发送请求到后端,后端接收数据参数的地址

  };

```

 2.内置的JS内:

 在script标签中,在export default{}内的data(){}内的return{}中设置表单返回的结构体(可以在结构体内设置属性)

 3.内置的HTML内:

 创建表单,为每个组件的标签设置相应的v-model,其等于结构体名.结构体属性名

 4.内置JS内:

 在script标签中,methods: {}中设置方法,方法名为在外置JS中设置好的方法名(如上述的testTsk),并以结构体名作为传递参数进行传递

 5.在内置的HTML内:

 在方法名设置好后,在Form表单中的按钮内设置@click="方法名"来进行调用方法,传递结构体。当点击按钮后就可以发送请求传递参数到后端。

 > 上述就是前端前端表单传输数据,后端接收数据的流程

;