在使用过程中会出现数据改变但是视图没有更新的情况(类型数组或者对象),这里我们就需要用到 $set

如果是对象类型:

this.$set(this.userInfo, 'name', 'gionlee');

其中this.userInfo 为变量名称, 'name' 为对象的key,'gionlee'为name对应的值。

如果是数组类型:

this.$set(this.arr, 0, 'gionlee');

其中this.arr 为数组,0 为 this.arr 对象的下标值,'gionlee'为arr[0]对应的值。

详情可以看:官方提供的API

------------------------------------------------------------分割线-----------------------------------------------------------------

也可以使用强制渲染 this.$forceUpdate()

更新于:2019-11-08

vue 数据改变但是视图没更新的更多相关文章

  1. vue 数组push元素 视图没更新

    Vue 包含一组观察数组的变异方法,所以它们也将会触发视图更新.这些方法如下: push() pop() shift() unshift() splice() sort() reverse() 问题描 ...

  2. vue修改elementUI的分页组件视图没更新问题

    转: vue修改elementUI的分页组件视图没更新问题 今天遇到一个小问题平时没留意,el-pagination这个分页组件有一个属性是current-page当前页.今天想在methods里面手 ...

  3. vue 数据没有驱动视图?

    Part.1  问题 数据改变,视图却没有根据数据而改变. 原因在于,数据并不在 vue 监听范围之内,vue 只对事先在 data 中声明的变量丶对象等类型数据进行监听 Part.2  例子 < ...

  4. sublime text3 - vue修改data,视图无更新

    ubuntu系统使用sublime text3做vue开发的时候遇到了一个问题,就是修改vue文件并保存后视图页面并不会随之修改,只有重新run dev时修改才会生效,原因没找到 猜想应该是subli ...

  5. [ 记录 ] Vue 对象数组中一项数据改变,页面不更新

    问题描述:将data中数据列表渲染到页面,循环生成 el-switch,点击页面中 el-switch 后数组中某项值改变,但是页面不更新 数据格式如下 export default{ data(){ ...

  6. vue 数据更新了但视图没改变?试试 $set

    场景 编辑表格中某行数据时,需要把它赋值给对话框表单 this.form,如果直接用 = 赋值,会导致:表单的输入框内容无法二次编辑. 使用 Vue-dev-tool 的 Components 功能测 ...

  7. vue数组中数据变化但是视图没有更新解决方案

    原文链接:http://www.cnblogs.com/sufubo/p/6906261.html#undefined 问题:在vue项目中,我更改数组中的某一条数据,直接arr[i]=newVal ...

  8. 解决微信小程序wepy真机预览跟本地表现不一样,数据变化了视图没变化

    当时搜了很多相关问题都没找到相似的 只看到有这个相似的描述wepy在onLoad里修改data-object的值页面不渲染 ,通过setData解决的. 但是这个还不是根本的解决办法,有些地方用set ...

  9. vue中改变数组的值视图无变化

    今天开发的时候遇到一个多选取消点击状态的,渲染的时候先默认都选中,然后可以取消选中,自建了一个全为true的数组,点击时对应下标的arr[index]改为false,数据改变了状态没更新,突然想起来单 ...

随机推荐

  1. .NET Core IdentityServer4实战 第二章-OpenID Connect添加用户认证

    内容:本文带大家使用IdentityServer4进行使用OpenID Connect添加用户认证 作者:zara(张子浩) 欢迎分享,但需在文章鲜明处留下原文地址. 在这一篇文章中我们希望使用Ope ...

  2. DevExpress控件安装破解和汉化使用教程

    这段时间因公司业务需要.net开发且需要用到DevExpress控件,我自己研究学习了一下,用的是visual studio(2013)和DevExpress(V14.1.4),VS2013的下载安装 ...

  3. Oracle 连接查询

    1.什么是连接查询?(B) 很多时候我们需要查询的数据并不是来源于同一张表,而是来源于多张表,而这种一个查询需要对多张表进行操作,就成为连接查询. 2.如何进行表的连接查询? 连接查询有两种方式:SQ ...

  4. CODING 敏捷实践完全指南

    你好,欢迎使用 CODING! 这份最佳实践将帮助你掌握 CODING 敏捷管理工具,更好地实践敏捷开发流程. 更多实践案例持续更新中 什么是敏捷研发 敏捷研发是涉及整个软件工程的理念与实践,它的核心 ...

  5. SQL Server作业报错特殊案例

    一个作业报错,报错信息如下,从错误信息根本看不出为什么出错,手工运行作业又成功了.一时不清楚什么原因导致作业出错. Message Executed as user: NT SERVICE\SQLSE ...

  6. Linux系统监控命令详解

    1. top命令 top命令经常用来监控Linux的系统状况,比如cpu.内存的使用,程序员基本都知道这个命令,但比较奇怪的是能用好它的人却很少,例如top监控视图中内存数值的含义就有不少的曲解. 输 ...

  7. 为什么从前那些.NET开发者都不写单元测试呢?

    楔子 四年前我虽然也写了很多年代码,由于公司虽然规模不小,却并非一家规范化的软件公司,因此在项目中严格意义上来说并没有架构设计.也不写单元测试,后来有幸加入了一家公司,这家公司虽然也是一家小公司,但是 ...

  8. Fiddler使用~知多少?

    昨天已经说了Fiddler的原理,那么今天就说说它是如何使用.我们进入正题. 在大多数网站测试的情况下,我们执行检测一个端口号或网址,这种场景一定会出现,记住,是一定会. 那么就需要我们过滤了,我们需 ...

  9. CanalSharp-mysql数据库binlog的增量订阅&消费组件Canal的.NET客户端

    一.前言 CanalSharp是阿里巴巴开源项目mysql数据库binlog的增量订阅&消费组件 Canal 的.NET客户端,关于什么是 Canal?又能做什么?我会在后文为大家一一介绍.C ...

  10. Jenkins高级用法 - Jenkinsfile 介绍及实战经验

    系列目录 1.Jenkins 安装 2.Jenkins 集群 3.Jenkins 持续集成 - ASP.NET Core 持续集成(Docker&自由风格&Jenkinsfile) 4 ...