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

### 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="方法名"来进行调用方法，传递结构体。当点击按钮后就可以发送请求传递参数到后端。

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