欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Vue为什么控件有值,但是却改动不了?

程序员文章站 2022-03-23 10:59:48
Vue为什么一些控件有值,但是却改动不了?(使用$set)最近工作项目中,遇到一个问题,特此来记录一下。上图是从服务端返回的数据。这里的akyh…属性,是我直接push进去的。但是我在界面上再想进行更改,却发现更不动,再加上还有一些表单的验证,这就导致:靠!我input框里面有值,居然还给我报错???后来发现了一些不同,我们来看下面这张图片:通过比较第一张图片和第三章图片,我发现第三张图片多了get和set方法。原因由于受JavaScript的限制,vue.js不能监听对象属性的添加和...

Vue为什么一些控件有值,但是却改动不了?(使用$set)

最近工作项目中,遇到一个问题,特此来记录一下。
Vue为什么控件有值,但是却改动不了?
上图是从服务端返回的数据。这里的akyh…属性,是我直接push进去的。
但是我在界面上再想进行更改,却发现更不动,再加上还有一些表单的验证,这就导致:
Vue为什么控件有值,但是却改动不了?
靠!我input框里面有值,居然还给我报错???

后来发现了一些不同,我们来看下面这张图片:
Vue为什么控件有值,但是却改动不了?
通过比较第一张图片和第三章图片,我发现第三张图片多了get和set方法。

原因

由于受JavaScript的限制,vue.js不能监听对象属性的添加和删除,因为在vue组件初始化的过程中,会调用getter和setter方法,所以该属性必须是存在在data中,视图层才会响应该数据的变化

解决办法
1.使用this.$set(obj, key, value)/vue.set(obj, key, value)

Vue为什么控件有值,但是却改动不了?

2.通过Object.assign(target, sources)方法

Vue为什么控件有值,但是却改动不了?

参考:https://blog.csdn.net/hhkongbai/article/details/101022019

本文地址:https://blog.csdn.net/weixin_41898003/article/details/111143993

相关标签: 前端 vue