vuejs对象更新渲染_vue 对对象的属性进行修改时,不能渲染页面 vue.$set()
我在vue里的方法里给一个对象添加某个属性时,我console.log出来的是已经更改的object ,但是页面始终没有变化
原因如下:
**受现代 JavaScript 的限制 (而且 Object.observe 也已经被废弃),Vue 不能检测到对象属性的添加或删除。由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程,所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的。
https://cn.vuejs.org/v2/guide/reactivity.html
**
官方API:Vue.set():
此时我们需要知道Vue.set()需要哪些参数,
调用方法:Vue.set( target, key, value )
target:要更改的数据源(可以是对象或者数组)
key:要更改的具体数据
value :重新赋的值
Tip:Vue.set()在methods中也可以写成this.$set()
解决办法:
this.$set(this.oilBrandsArr[index], 'checked', true)
**注意: **如果要对这个对象进行$set操作就不要用别的方法对这个对象进行操作,否则this.$set()则不会生效
this.oilBrandsArr[i].checked = true
别的地方又用this.$set() 则都不会触发更新
附加:有时你想向一个已有对象添加多个属性,例如使用 Object.assign() 或 _.extend() 方法来添加属性。但是,这样添加到对象上的新属性不会触发更新。在这种情况下可以创建一个新的对象,让它包含原对象的属性和新的属性:
this.someObject = Object.assign({}, this.someObject, { a: 1, b: 2 })
vuejs对象更新渲染_vue 对对象的属性进行修改时,不能渲染页面 vue.$set()相关推荐
- json vue 对象转数组_vue 基础入门(一)修改
vue基础入门(一) 1. 什么是vue Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架. Vue 只关注视图层, 采用自底向上增量开发的设计. Vue 的目标 ...
- 构建时预渲染:网页首帧优化实践
前言 自JavaScript诞生以来,前端技术发展非常迅速.移动端白屏优化是前端界面体验的一个重要优化方向,Web 前端诞生了 SSR .CSR.预渲染等技术.在美团支付的前端技术体系里,通过预渲染提 ...
- vuejs对象更新渲染_vue 数组和对象渲染问题
vue 数组和对象渲染问题 最近项目有点忙碌,遇到好多问题都没有总结(╥﹏╥),在开发过程中,取vuex中的数组渲染完成之后,再次修改数组的值,数据更新了,但是视图并没有更新.以为是数组更新的问题,后 ...
- json vue 对象转数组_vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
本文实例讲述了vue.js基于v-for实现批量渲染 json数组对象列表数据.分享给大家供大家参考,具体如下: vuejs的出现减轻了对dom的直接操作,同时它提供的 v-for 渲染列表数据也给我 ...
- vue 对象里面放数组刷新问题_Vue 数组和对象更新,但是页面没有刷新的解决方式...
在使用数组的时候,数组内部数据发生改变,但是与数组绑定的页面的数据却没有发生变化. {{item.name}} data () { return { msg: 'Welcome to Your Vue ...
- 小程序云开发更新数组的指定对象的值
云开发,在小程序实现 代码说明': 在这里,数据集合 groupList 中的 userList 是一个用户列表数组,我要更新数组中,openid 等于我的openid 的在线状态为 true. 先查 ...
- 不能更新,数据库或对象为只读
最近帮别人处理下数据,发现添加数据时,就提示"ASP 不能更新.数据库或对象为只读.",从网上找了,也没有解决我的问题. 1.服务器的数据目录mdb文件所在的目录,是只读的 2.数 ...
- vue渲染时数据对象里面的子对象的属性报错undefined,但页面正常渲染
vue渲染时数据对象里面的子对象的属性报错undefined,但页面正常渲染. 报如图所示错误 页面中报错的位置 原因是在data中申明了空对象,页面在渲染的时候,数据还没获取到的时候,首先渲染的是初 ...
- Asp.net 用DataSet对象更新数据(SqlDataAdapter) DataTable加主键
私の青い色スペース 专注于.NET,认真把握好生命的每一秒,让每天都过的有意义..! 常用链接 我的随笔 我的评论 我参与的随笔 留言簿(1) 给我留言 查看公开留言 查看私人留言 我参与 ...
- vue 数组对象更新
一.概述 在使用数组的时候,数组内部数据发生改变,但是与数组绑定的页面的数据却没有发生变化. 示例代码如下: <template><div style="margin-le ...
最新文章
- opengl 大作业_大学新生作业10米长!网友:确认过眼神,是我画不出的十米长卷……...
- SZOJ 142 钦定
- tcpdump的使用
- linux权限切换命令,Linux基础常用命令汇总(权限操作)
- Illustrator 教程,如何在 Illustrator 中变换图稿?
- uiswitch样式_可变大小、颜色边框、样式的UISwitch
- 【Vue】Aliplayer 视音频播放的实践与思考
- 周纪三 周慎靓王元年(辛丑,公元前320年)——摘要
- 计算机适合用mac吗,原神能用苹果电脑玩吗
- VESD联网防静电门禁管理系统有哪些功能?
- 20世纪最伟大的十大算法
- mac 移动硬盘装linux系统安装教程,移动硬盘上安装Ubuntu系统
- 多重循环打印图形(3)——打印平行四边形
- Harmonizome数据库 – 一个集合多种pathway(or other)的网站
- 获取分辨率函数是什么_使用深度学习来实现超分辨率的介绍
- 关注博主即可阅读全文
- html+css知识点全面总结(三)
- wps可以用来学计算机考试吗,计算机wps和ms哪个简单?计算机一级office考试技巧有什么?...
- 编写一个程序,输入一个正整数,并做以下运算:如果为偶数,除以2,如果为奇数乘3加1.得到结果按上述要求,直到最后结果为1,一共要经过多少次这样的运算才得到数1
- 《剑指offer》所有面试题及其参考代码
热门文章
- tamtam-nuget-imageserver
- 【操作系统】实验四 主存空间的分配和回收
- 真正的轻量级WebService框架——使用JAX-WS(JWS)发布WebService
- 浏览器Quirksmode(怪异模式)与CSScompat
- NSGA2 算法Matlab实现
- 利用composer搭建PHP框架(一.路由解析)
- 实习成长之路:MySQL十三: count(*)这么慢,我该怎么办?为什么那么慢?
- Android 签名问题记录MinSdkVersionException: Failed to determine APK‘s minimum supported platform version
- oracle中批量删除xxx开头表的数据和批量修改以xx开头字段的值
- android自定义 ProgressBar(继承自View)