天天看点

vue收集表单数据(2022-04-22学习笔记)

前言

​form​

​​标签的​

​action​

​​用于指定表单提交的地址,现在的前后端交互我们一般用不到这个属性,不会真正往一个地址提交数据。​

​form​

​​只是作为一个元素的呈现,一个结构,我们提交数据使用的是​

​ajax​

​。

label

添加控件的点击区域。

vue收集表单数据(2022-04-22学习笔记)

单选

​name​

​相同,表示这组单选是一组的,只能选择一个。

vue收集表单数据(2022-04-22学习笔记)

​v-model​

​​默认获取的是​

​value​

​的内容。

vue收集表单数据(2022-04-22学习笔记)

多选

多选也要配置好value值。

vue收集表单数据(2022-04-22学习笔记)

绑定的是数组。

vue收集表单数据(2022-04-22学习笔记)

下拉框

vue收集表单数据(2022-04-22学习笔记)
vue收集表单数据(2022-04-22学习笔记)

表单提交

表单提交的默认行为就是跳转页面,会刷新一下,我们需要阻止默认行为。

vue收集表单数据(2022-04-22学习笔记)

数据传递后端

将vue包装的对象转化成JSON。

vue收集表单数据(2022-04-22学习笔记)

一般我们将数据打包一下。不是直接用_data。

vue收集表单数据(2022-04-22学习笔记)

输入框控制只输入数字

vue收集表单数据(2022-04-22学习笔记)

去掉首尾空格

总结