解决vue this.$forceUpdate() 处理页面刷新问题(v-for循环值刷新等)


Posted in Javascript onJuly 26, 2018

问题描述:

在使用Vue框架开发时,在函数中改变了页面中的某个值,在函数中查看是修改成功了,但在页面中没有及时刷新改变后的值;

解决:

运用 this.$forceUpdate()强制刷新

代码案例

<Select v-model="carSafeLine.insuranceName" placeholder="请选择" class="mulisel option-h" filterable clearable :disabled="editstatus" @on-change="selectInsurance">
 <Option v-for="item in dataArr" :key="item.code" :value="item.code" :label="item.codename" :disabled="item.disabled"></Option>
</Select>
methods: {
 selectInsurance(){ //刷新车辆保险可选状态
 for(var i=0; i<this.dataArr.length; i++){ 
  var flag = false; //默认没有选中
  var itemI = this.dataArr[i];
  for(var j=0; j<this.form.carInsuranceVOList.length; j++){ //检测选项是否已被选中过
  var itemJ = this.form.carInsuranceVOList[j];
  if(itemI.code == itemJ.insuranceName){
   flag = true;
   break;
  }
  }
  if(flag){
  itemI.disabled = true;
  }else{
  itemI.disabled = false;
  }
 }
 this.$forceUpdate(); //强制刷新,解决页面不会重新渲染的问题
 }
}

总结

以上所述是小编给大家介绍的解决vue this.$forceUpdate() 处理页面刷新问题(v-for循环值刷新等),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript 拾漏补遗
Dec 27 Javascript
jQuery插件 tabBox实现代码
Feb 09 Javascript
jQuery JSON的解析方式分享
Apr 05 Javascript
JS操作Cookies包括(读取添加与删除)
Dec 26 Javascript
window.onresize 多次触发的解决方法
Nov 08 Javascript
JS中捕获console.log()输出的方法
Apr 16 Javascript
jQuery满意度星级评价插件特效代码分享
Aug 19 Javascript
jQuery删除节点用法示例(remove方法)
Sep 08 Javascript
jQuery实现动态添加、删除按钮及input输入框的方法
Apr 27 jQuery
vue2.0.js的多级联动选择器实现方法
Feb 09 Javascript
jquery获取input输入框中的值
Nov 13 jQuery
支付宝小程序实现省市区三级联动
Jun 21 Javascript
vue router 配置路由的方法
Jul 26 #Javascript
vue+webpack模拟后台数据的示例代码
Jul 26 #Javascript
JavaScript设计模式之工厂模式和抽象工厂模式定义与用法分析
Jul 26 #Javascript
vue父组件异步获取数据传给子组件的方法
Jul 26 #Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
Jul 26 #Javascript
JavaScript设计模式之单例模式原理与用法实例分析
Jul 26 #Javascript
JavaScript设计模式之原型模式分析【ES5与ES6】
Jul 26 #Javascript
You might like
CentOS 6.3下安装PHP xcache扩展模块笔记
2014/09/10 PHP
PHP 微信支付类 demo
2015/11/30 PHP
document.getElementById介绍
2011/09/13 Javascript
JS实现图片横向滚动效果示例代码
2013/09/04 Javascript
经过绑定元素时会多次触发mouseover和mouseout事件
2014/02/28 Javascript
什么是 AngularJS?AngularJS简介
2014/12/06 Javascript
在其他地方你学不到的jQuery小贴士和技巧(欢迎收藏)
2016/01/20 Javascript
js输出数据精确到小数点后n位代码
2016/07/02 Javascript
javascript中的 object 和 function小结
2016/08/14 Javascript
jQuery属性选择器用法示例
2016/09/09 Javascript
ie下js不执行的几种可能
2017/02/28 Javascript
学习使用Bootstrap输入框、导航、分页等常用组件
2017/05/11 Javascript
Vue实现一个返回顶部backToTop组件
2017/07/25 Javascript
js 将canvas生成图片保存,或直接保存一张图片的实现方法
2018/01/02 Javascript
Angular6 用户自定义标签开发的实现方法
2019/01/08 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
2019/05/24 Javascript
解决vue组件中click事件失效的问题
2019/11/09 Javascript
[07:57]DOTA2热力大趴狂欢夜 广州站活动回顾
2013/11/27 DOTA
Python Requests安装与简单运用
2016/04/07 Python
tensorflow 加载部分变量的实例讲解
2018/07/27 Python
Python 生成 -1~1 之间的随机数矩阵方法
2018/08/04 Python
pytorch对可变长度序列的处理方法详解
2018/12/08 Python
Python零基础入门学习之输入与输出
2019/04/03 Python
Python操作远程服务器 paramiko模块详细介绍
2019/08/07 Python
Python超越函数积分运算以及绘图实现代码
2019/11/20 Python
百丽国际旗下购物网站:优购
2017/02/28 全球购物
美国农场商店:Blain’s Farm & Fleet
2020/01/17 全球购物
法学研究生自我鉴定范文
2013/12/04 职场文书
宠物店的创业计划书范文
2014/01/11 职场文书
《口技》教学反思
2014/02/21 职场文书
新闻工作者先进事迹
2014/05/26 职场文书
毕业生代领毕业材料的授权委托书
2014/09/29 职场文书
2014年班长个人工作总结
2014/11/14 职场文书
五好家庭申报材料
2014/12/20 职场文书
获奖感言怎么写
2015/07/31 职场文书
三好学生竞选稿
2015/11/21 职场文书