vue中使用form表单提交数据到后台

前面提到过.vue异步上传回调可以伪造一个formdata来完成.

下面演示一个简单的使用vue提交表单的过程.

这是一段提交修改用户名的代码.

2017-12-29 16-27-47屏幕截图.png

首先为vue的form表单的提交按钮绑定一个submit事件 点击提交后会被中止并调用updateting函数即调用更新函数.

v-model 可以获取当前input输入的内容并直接交给一个定义过的对象.

下面是javascript代码.

2017-12-29 16-29-36屏幕截图.png

这里我使用了一个formdata对象伪造一个表单来提交我输入的数据 在post请求当中我把整个formdata的表单都请求了出去.回调的时候我通过判断后台返回的参数来确认数据是否更新成功,后台的代码是我已经写好了的.

更新成功我会渲染一个DOM来提示用户.

这其中最需要注意的是js代码,必须注意数据band的方式 和调用方式

日记本

如果觉得我的文章对您有用,请随意赞赏。您的支持将鼓励我继续创作!

赞赏支持
被以下专题收入,发现更多相似内容