Vue的数据更新,页面不更新的解决办法
可能原因
更新的数据跟源数据不是同一个,即不是同一个引用
解决办法
最稳妥的办法,可通过拿到源数据取索引的方式进行数据的更新,如:
有一个源数据叫:originData
那么如果在更新时,通过this.originData[index].time = newValue的方式进行更新,而不是item.time = newValue
这样,更新的是源数据,大概率可解决问题。
其他可能的原因及解决办法
页面组件重复
解决办法: 给组件加上key='xxx'xxx确保不要重复部分对象不支持更改,如:scope.row
解决办法: 新建对象let newObj = {...scope.row},甚至深拷贝let newObj = JSON.parse(JSON.stringify(scope.row))数据不是双向绑定
解决办法:响应式更新this.$set(this, '你的变量', 新值)数据层级过深
解决办法:强制更新this.$forceUpdate()
Vue的数据更新,页面不更新的解决办法的更多相关文章
- react-router url参数更新 但是页面不更新的解决办法
今天发现, 当使用react-router(v4.2.2)时,路由需要传入参数, 但是如果路由跳转时,url仅仅改变的是参数部分,如从hello/1跳转到hello/2,此时虽然参数更新了,但是页面是 ...
- Vue数据更新页面没有更新问题总结
Vue数据更新页面没有更新问题总结 1. Vue无法检测实例别创建时不存在于data中的property 原因: 由于Vue会在初始化实例时对property执行getter/setter转化,所以p ...
- Springboot静态文件不更新的解决办法,以及Springboot实现热部署
Springboot静态文件不更新的解决办法,以及Springboot实现热部署 原文链接:https://www.cnblogs.com/blog5277/p/9271882.html 原文作者:博 ...
- ie、firefox、chrome中关于style="display:block" 引发的页面布局错乱的解决办法
ie.firefox.chrome中关于style="display:block" 引发的页面布局错乱的解决办法: table中tr 添加style="display:b ...
- Xamarin Android SDK无法更新的解决办法
Xamarin Android SDK无法更新的解决办法 Xamarin Android SDK无法更新的解决办法,更新时候,提示警告信息:A folder failed to be moved. ...
- hexo创建的tags和categories页面为空的解决办法
title: hexo创建的tags和categories页面为空的解决办法 toc: false date: 2018-04-16 02:26:10 主题:landscape 添加type以及men ...
- vue在html中出现{{}}原因及解决办法
在刚开始接触vue的时候,我们都是直接用<script>引入vue.js使用.没有借助vue-cli脚手架来构建项目. 对于一个初学者来说,跟着文档慢慢搬砖,使用vue进行数据绑定. 记得 ...
- vuex页面刷新数据丢失的解决办法
在vue项目中用vuex来做全局的状态管理, 发现当刷新网页后,保存在vuex实例store里的数据会丢失. 原因: 因为store里的数据是保存在运行内存中的,当页面刷新时,页面会重新加载vue实例 ...
- Android SDK Manager无法更新的解决办法
Fetching https://dl-ssl.google.com/android/repository/addons_list-1.xmlFailed to fetch URL https://d ...
- Android Studio Gradle更新的解决办法
环境: Win7_64旗舰版.Android Studio2.1.1 问题描述: 在打开Android Studio项目的时候,会下载项目对应版本的gradle,由于是国外网站导致更新较慢,该版本是在 ...
随机推荐
- ET框架6.0分析二、异步编程
概述 ET框架很多地方都用到了异步,例如资源加载.AI.Actor模型等等.ET框架对C#的异步操作进行了一定程度的封装和改造,有一些特点: 显式的或者说强调了使用C#异步实现协程机制(其实C#的异步 ...
- Redis系列13:分布式锁实现
Redis系列1:深刻理解高性能Redis的本质 Redis系列2:数据持久化提高可用性 Redis系列3:高可用之主从架构 Redis系列4:高可用之Sentinel(哨兵模式) Redis系列5: ...
- Kubernetes(k8s)定时任务:CronJob
目录 一.系统环境 二.前言 三.Kubernetes CronJob简介 四.kubernetes CronJob和Linux crontab对比 五.CronJob表达式语法 六.创建CronJo ...
- 基于SqlSugar的开发框架循序渐进介绍(30)-- 整合客户关系管理系统模块功能
以前在随笔<Winform开发框架之客户关系管理系统(CRM)的开发总结系列1-界面功能展示 >的几篇随笔中介绍过基于WInform开发框架开发的CRM系统,系统的功能主要也是围绕着客户相 ...
- 国际顶刊《PNAS》:爱发朋友圈的人,更容易长寿
点上面关注我们,每日获取前沿新知 近几十年来,智能手机和网络的普及率越来越高,与此同时,"朋友圈"应运而生. 在这个朋友圈里,有人十分活跃,而也有些人是"国家级潜水运动员 ...
- 信息收集_网络扫描_nmap
信息收集_网络扫描nmap 目标说明 -iL <inputname> (从列表或文件输入) -iR <hostnum> (随机选择生成目标数量) --exclude <h ...
- JavaWeb编程面试题——Spring Framework
引言 面试题==知识点,这里所记录的面试题并不针对于面试者,而是将这些面试题作为技能知识点来看待.不以刷题进大厂为目的,而是以学习为目的.这里的知识点会持续更新,目录也会随时进行调整. 关注公众号:编 ...
- 2023安洵杯web两道WP
Web CarelessPy 在首页提示存在eval和login的路由,在download存在任意文件下载 访问eval可以读取目录下的文件,知道/app/pycache/part.cpython-3 ...
- CANoe学习笔记(一):创建第一个仿真工程(基于CAN):点灯
目录 内容: ①创建两个节点,Switch和Light节点 ②创建两个Panel界面 ③capl代码实现Switch控制Light亮灭 事先准备: 养成良好的习惯,将不同文件放入不同文件夹,创建如下几 ...
- WPF 入门笔记 - 03 - 样式基础及模板
程序的本质 - 数据结构 + 算法 本篇为学习李应保老师所著的<WPF专业编程指南>并搭配WPF开发圣经<WPF编程宝典第4版>以及痕迹大佬<WPF入门基础教程系列> ...