POST请求接口的值之传递值

2020-09-14

简单介绍一下使用接口时,将后台数据传入到前端显示以及前端表单传值请求接口

前端表单创建

这里,前端简单设置一下,包含账号、密码输入框和登陆按钮。

代码

image-20200914152811513

前端显示

image-20200914152841291

这里,设置input的 v-model 属性,双向绑定数据

image-20200914153322122

后台数据处理

传值 表单 –> 后台

表单数据请求api,即表单的值传到js里,在请求api返回数据。

这里,红框里的 this.user 和 this.passwd 代表着前端页面的两个input的内容

image-20200914154250940

请求后有响应

image-20200914154551354

传值 后台响应接口 –> 前端

将响应数据的 data.msg 字段传回infor的输入框中

image-20200914155136516

对于响应后对数据进行多种处理,可使用以下方法:(涉及打印和传值两操作)

image-20200914160853266

总结

涉及的重难点,v-model双向数据绑定、箭头函数、数据json取值操作