项目中有个需求,在表格里点击某条数据弹出窗口进行修改值,当时弹出的是input上进行修改,所以当我点击数据的时候,先进行回显原先的数据,再进行修改。
点击某条数据,弹出窗口,进行后台请求,将后台返回的数据名称进行赋给这个名称的input框
<input type="text" v-model="form.name">
methods:{
//请求数据
goodsList(id){
this.$request(this.$config.baseApi+‘/user/address/index?uid=‘${id},‘get‘)
.then(res=>{
if (res.code===200){
//如果用这种方式直接赋值,很可能会在页面上不能编辑,所以让它强制刷新
//根据官方文档定义:如果在实例创建之后添加新的属性到实例上,它不会触发视图更新
// this.form.name=res.data.content
//解决办法:$set
this.$set(this.form,‘name‘,this.form.name)
}
})
}
}
网上搜的还有一种解决方案就是直接在data里边先列出变量,eg:
data(){
return{
form:{
name:‘ ‘
}
}
},
但当时项目的form里边的变量不定,需要后台给出,所以只能通过第一中方法,用哪种方法还需要看情况而定
原文:https://www.cnblogs.com/yanyanliu/p/11871832.html