在使用数组的时候,数组内部数据发生改变,但是与数组绑定的页面的数据却没有发生变化。

  • {{item.name}}

data () {

return {

msg: 'Welcome to Your Vue.js App',

todos: [{

name: 'aa',

age: 14

}, {

name: 'bb',

age: 15

}, {

name: 'cc',

age: 16

}],

obj: {name: 'lihui', age: 17}

}

},

methods: {

changeTodos: function () {

var _this = this

_this.todos[0] = {

name: 'zhangsan',

age: 15

}

console.log(this.todos)

/*

this.$set(this.todos, 0, 'nn')

this.$forceUpdate()

*/

}

这种修改得方式,无法出发数组得set,导致页面得数据不会改变。

有三种解决方式。

一、使用全局得set方法。

this.$set(this.todos,0,{name: 'zhangsan',age: 15});或者对象this.$set(this.obj,'key',value);

二,强制更新

this.$forceUpdate()

以上这篇Vue 数组和对象更新,但是页面没有刷新的解决方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

vue 对象里面放数组刷新问题_Vue 数组和对象更新,但是页面没有刷新的解决方式...相关推荐

  1. php 文件 不更新,php页面不刷新更新数据

    php页面不刷新更新数据 php页面不刷新更新数据实现起来很简单,我们可以使用前端的ajax技术. ajax作用:ajax技术的目的是让javascript发送http请求,与后台通信,获取数据和信息 ...

  2. vue数组变化视图_vue数组操作不更新视图问题(示例代码)

    vue 观察数组的变异方法 更新视图 push() pop() shift() unshift() splice(i,n,arr) sort(xx) reverse() ex: app.book.pu ...

  3. vue数组变化视图_vue数组操作不更新视图问题

    vue 观察数组的变异方法 更新视图 push() pop() shift() unshift() splice(i,n,arr) sort(xx) reverse() ex: app.book.pu ...

  4. 微信小程序webview页面不刷新,webview缓存页面不刷新,小程序webview页面不刷新,小程序webview地址追加参数页面还是缓存,解决办法

    项目需求,在微信小程序首页的 banner 图,打开公司官网,这个功能很好实现,就是专门整个 webview 组件所在页面,以后凡是有这种需求的都跳转到这个页面,只需要切换不同的路由地址就行了,可是最 ...

  5. bootstrap切换tab页局部刷新_Rails 用 RJS 简单有效的实现页面局部刷新

    我们时常在做项目的时候会遇到这样的需求,页面上有个基本数据的下拉框,用于选择一些数据,如:项目版本号.联系人.收件地址.银行账号列表什么的. 而需求可能会要求说可以在这个页面随时增加那些下拉框的选择值 ...

  6. 微信开发者工具:代码更新后页面未刷新

    问题 微信开发者工具代码更新后页面未更新.只用通过手动点击编译才可更新页面 尝试过稳定版 16.15 版本均未解决 开发环境 项目配置:Taro3 + React17 + Node18 + @antm ...

  7. python flask 实时刷新数据_从Flask实时更新变量而无需刷新页面

    Je suis ici La température de la pièce est de: {{ temp }}°. function() { $SCRIPT_ROOT = {{ request.s ...

  8. ajax 页面无刷新,Ajax的页面无刷新实现详解(附代码)

    这次给大家带来Ajax的页面无刷新实现详解(附代码),Ajax页面无刷新实现的注意事项有哪些,下面就是实战案例,一起来看一下. ajax (ajax开发) AJAX即"Asynchronou ...

  9. JSP 页面自动刷新

    想象一下,如果要直播比赛的比分,或股票市场的实时状态,或当前的外汇配给,该怎么实现呢?显然,要实现这种实时功能,您就不得不规律性地刷新页面. JSP提供了一种机制来使这种工作变得简单,它能够定时地自动 ...

最新文章

  1. idea缩写快捷键_IDEA快捷键大全 快速页面重构
  2. 1分钟入门angular动画效果animations,敲简单滴哟~~☺
  3. php扩展xdebug安装
  4. Precision Helper:最佳免费 CHM 制作软件
  5. php 查看当前字符编码,PHP检测当前字符编码并转码
  6. python批量ping脚本_Python多线程批量Ping主机IP的脚本
  7. clion导入mysql库_CLion如何添加依赖库 ? 需要把mysql/Connector c++放入 用cpp连接数据库...
  8. maven下设置默认jdk版本和maven项目构建默认使用jdk版本
  9. aws lam nodejs mysql_NodeJs IF Statement in AWS Lambda using MySQL database
  10. junit mockito_Mockito存根异常– JUnit,TestNG
  11. IE9 表格错位bug
  12. python 可视化界面 打开excel_python如何将excel数据处理可视化
  13. 【计算机语言】C语言小游戏——贪吃蛇
  14. 计算机软件的前景,2020计算机软件专业就业前景如何?
  15. exp 导数oracle,指数函数 exp(x) 导数的直接求法
  16. 解决手机WiFi(电脑热点)一直正在获取IP地址或无法访问互联网【与网上其他方法不同】
  17. iOS--系统升级之后Xcode无法识别
  18. ABP开发框架的总体介绍
  19. 河内塔问题(Hanoi Tower)
  20. PMP考试 变更管理专题

热门文章

  1. Python入门100题 | 第013题
  2. #论文 《Towards Binary-Valued Gates for Robust LSTM Training》
  3. 自动驾驶技术-环境感知篇:多传感器融合技术
  4. 云计算大会有感—MapReduce和UDF
  5. python的des和3des加解密
  6. 支付宝架构师眼里的高并发架构
  7. windows7 'telnet'不是内部或外部命令--转载
  8. txt文件导入mysql--转
  9. linux shell less 命令---转
  10. java或者jsp中修复会话标识未更新漏洞