当键以前不存在时，修改vue中的值不会更新视图
在Vue中，当键以前不存在时，修改值不会更新视图的原因是因为Vue无法检测到这种变化。Vue的响应式系统是基于对象的getter和setter来实现的，当数据被访问时，Vue会追踪这个数据，并在数据发生变化时更新相关的视图。
但是，当我们直接修改一个数组的索引或者给对象添加新的属性时，Vue无法检测到这种变化。这是因为Vue在实例化时会对数据进行初始化，只有初始化时存在的属性才会被转换成响应式的。所以，当我们直接修改一个不存在的键时，Vue无法追踪到这个变化，也就无法更新相关的视图。
为了解决这个问题，Vue提供了一些方法来处理这种情况。对于数组，我们可以使用Vue提供的变异方法（如push、pop、splice等）来修改数组，这样Vue能够检测到数组的变化并更新视图。对于对象，我们可以使用Vue提供的$set方法来添加新的属性，这样Vue也能够检测到对象的变化并更新视图。
另外，如果我们事先知道要添加的属性，也可以在初始化数据时将其设置为初始值，这样Vue就能够将其转换为响应式的，并能够追踪到后续的变化。
总结起来，当键以前不存在时，修改Vue中的值不会更新视图的解决方法有以下几种：
- 对于数组，使用Vue提供的变异方法（如push、pop、splice等）来修改数组。
- 对于对象，使用Vue提供的$set方法来添加新的属性。
- 在初始化数据时，将要添加的属性设置为初始值。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云人工智能：https://cloud.tencent.com/product/ai
- 腾讯云物联网平台：https://cloud.tencent.com/product/iotexplorer
- 腾讯云移动开发：https://cloud.tencent.com/product/mobile
- 腾讯云区块链服务：https://cloud.tencent.com/product/tbaas
- 腾讯云元宇宙：https://cloud.tencent.com/product/metaverse
相关·内容
我希望复选框在数据中模拟一个实际不存在的值。All按钮时，它应该更新selected键，即使它不存在(好吧，这就是想法)this.someData.forEach(element =>element.selected;}
但是，即使值已经更新，复选框也不会做出反应。要做到这一点，我需要获取数据并手动添加键</e
浏览 11提问于2019-11-21得票数 0
回答已采纳
我在用Vue组件和Laravel做出版物。我有一个名为publications.vue的父组件，它有两个名为create.vue和list.vue的子组件，而list.vue则有另一个称为remove.vue和update.vue的子组件。问题是，当我在数组中添加或删除一个发布时，它工作得很完美，但是当我修改一个元素时，它就没有反应了。控制器工作
浏览 3提问于2020-08-13得票数 1
回答已采纳
1回答
Vue.js vuex道具不改版
、、、、
({ }) }我现在遇到的问题是，当我在另一个组件中更改ports state时，它正确地更新了ports state，但是v-for循环中的端口没有被更新。如何确保端口组件rerenders中的数据也是正确的？
浏览 2提问于2018-10-06得票数 0
回答已采纳
></Person><template> <label for="name_p"> Name</label>
<input id="name_p" v-model="person.nameconsole.lo
浏览 4提问于2017-07-27得票数 0
回答已采纳
我安装了vue-cli并制作了一些组件，一切都很好，直到我不得不用键更新一些对象值。obj = { key2: value2,};
当您使用索引直接设
浏览 5提问于2017-05-01得票数 1
我正在构建一个网站，它使用Vue来驱动大多数UI。主要组件是一个视频列表，每当某个URL模式匹配时，该列表就会被更新。主组件(video-list)主要如下所示： data: () => ({ singlePost:理想情况下，当选择新类别时，所有当前可见的列表项都会淡出，然后新的列表项就会淡入。我看过，但没有得到我想要的效果
浏览 3提问于2017-05-29得票数 0
回答已采纳
我是javascript和javascript框架世界的新手。在Vue JS中，track-by或key在v-for中的实际用途是什么？
我读了这些文档，但并没有真正理解它的用途。
浏览 3提问于2017-05-19得票数 4
回答已采纳
memcache的python接口有一个add方法：
设置键的值，当且仅当该项尚未在memcache中如果添加，返回值为True，错误时为False。
因此，您可以在不存在的情况下添加一个项，并通过返回值查看它以前是否存在。与此等效的
浏览 5提问于2010-04-09得票数 1
回答已采纳
2回答
我试图在一个名为"cartItems“的Vuex数组中更新quantity属性，但是它没有使用v-for循环更新它。ShoppingCart.vue (父母) <CartItem v-for="(item, index) in $store.getters.getCart" :loopIndex="index
浏览 0提问于2018-12-16得票数 4
回答已采纳
我有一个带有一些输入的表单，我提交表单并以一个模式显示数据。它可以工作，但我不确定我这样做是正确的，而且代码看起来很混乱。label><input type="text" name="lastName"> <button>Submit</button></div>let app = new Vu
浏览 7提问于2020-02-10得票数 2
回答已采纳
我有一个vue组件，它在编辑表单时执行一系列条件来检查是否有以前的数据。因为表单正在被编辑，所以总是有以前的数据，但是如果我在输入字段中键入一些内容并单击保存按钮，我新键入的输入不会被持久保存，而是保留相同的旧数据。我知道发生这种情况是因为v-if条件始终为真，但我想不出一种方法来修改条件，如果用户键入新数据来替换它。原始作业是作为包含旧/原始数据的属性传递的。newJo
浏览 22提问于2020-10-27得票数 0
回答已采纳
我在v中呈现一些HTML我试着给出:键的各种不同的价值
我在vue v1中没有这个问题，只有在v2中
浏览 2提问于2016-10-20得票数 2
回答已采纳
支柱的新值，则不会更新destinationValue的值。我需要destinationValue可以从< input>标记中更新，但每次组件接收到新的originValue时也需要覆盖。如果收到originValue的新值，则不会在模板中更新该值。这是因为destinationValue在观察者函
浏览 2提问于2017-03-01得票数 3
请问我们如何通过键删除Vuex状态对象中的项，并仍然让绑定到getter的计算属性自动更新？我有一个简单的商店： users: {} // object of objects keyed by userid adminsdelete state.users[userid] // the user id deleted, i can verify this in dev-too
浏览 3提问于2018-08-15得票数 2
回答已采纳
1回答
刷新实体框架视图结果
、、、、
我在数据库中有一个名为vue_demande的视图，我需要在我的应用程序中获取它的所有行： {if ( context == null) context = GetContext();
return context.Set<vue_demande>().AsNoTracking<vue
浏览 1提问于2015-07-07得票数 0
回答已采纳
<button v-on:click="dostuff">DO STUFF</button><script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script src="test.js"></script>
浏览 0提问于2018-09-20得票数 3
我正在尝试如何在文本输入中变异一个道具，而不会导致组件重新呈现。这是我的密码 <div class="row"> } }; components: {
CategoryComponen
浏览 3提问于2020-09-02得票数 1
回答已采纳
当我加载页面时，我会获取一个列表。项目的资料来源是在线的：
HTTP请求很好地发送并返回足够的数据： this.getOptboxes();components: {
'optbox': OptboxComponent为什么我的更改没有自动应用？
浏览 3提问于2016-08-07得票数 4
2回答
我有一个名为"sortable“的自定义指令，但是我遇到了DOM的问题。问题是，当我拖放一个项时，数组被更改了，但是DOM没有改变。这是我的自定义指令： bind: function(el, binding, vnode) {
浏览 2提问于2016-12-21得票数 2
回答已采纳
我有一个看似与反应性有关的奇怪错误，但据我所知，这与反应性无关。console.log('The value...self.value); ...commonAttributes,这会一直持续到巡查员的领地例如，当我将文本区域的绑定值设置为"abc“时，控制台(self.value)将成功地显示"abc&
浏览 0提问于2019-05-01得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
