解决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 相关文章推荐
利用js制作html table分页示例(js实现分页)
Apr 25 Javascript
jQuery控制元素显示、隐藏、切换、滑动的方法总结
Apr 16 Javascript
JavaScript数组去重的3种方法和代码实例
Jul 01 Javascript
利用jQuery实现WordPress中@的ID悬浮显示评论内容
Dec 11 Javascript
js+css实现select的美化效果
Mar 24 Javascript
Google 地图控件集详解及实例代码
Aug 06 Javascript
js时间比较 js计算时间差的简单实现方法
Aug 26 Javascript
canvas压缩图片转换成base64格式输出文件流
Mar 09 Javascript
JS实现的走迷宫小游戏完整实例
Jul 19 Javascript
AngularJS实现表单元素值绑定操作示例
Oct 11 Javascript
JS二分查找算法详解
Nov 01 Javascript
javascript代码优化的8点总结
Jan 29 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
php提示undefined index的几种解决方法
2012/05/21 PHP
div li的多行多列 无刷新分页示例代码
2013/10/16 PHP
PHP针对中英文混合字符串长度判断及截取方法示例
2017/03/31 PHP
TP5(thinkPHP5)框架基于ajax与后台数据交互操作简单示例
2018/09/03 PHP
jQuery一步一步实现跨浏览器的可编辑表格,支持IE、Firefox、Safari、Chrome、Opera
2009/08/28 Javascript
Iframe 自适应高度并实时监控高度变化的js代码
2009/10/30 Javascript
javascript中的缓动效果实现程序
2012/12/29 Javascript
jquery阻止后续事件只执行第一个事件
2014/07/24 Javascript
JS实现网页表格自动变大缩小的方法
2015/03/09 Javascript
JS中dom0级事件和dom2级事件的区别介绍
2016/05/05 Javascript
基于Node.js实现压缩和解压缩的方法
2018/02/13 Javascript
Node.js文件编码格式的转换的方法
2018/04/27 Javascript
vue+axios+mock.js环境搭建的方法步骤
2018/08/28 Javascript
微信小程序实现判断是分享到群还是个人功能示例
2019/05/03 Javascript
基于JS抓取某高校附近共享单车位置 使用web方式展示位置变化代码实例
2019/08/27 Javascript
ES10的13个新特性示例(小结)
2019/09/23 Javascript
Javascript实现html转pdf高清版(提高分辨率)
2020/02/19 Javascript
JS面向对象编程基础篇(一) 对象和构造函数实例详解
2020/03/03 Javascript
JavaScript链式调用原理与实现方法详解
2020/05/16 Javascript
[43:49]LGD vs CHAOS 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
[36:16]完美世界DOTA2联赛PWL S3 access vs Rebirth 第一场 12.19
2020/12/24 DOTA
Python爬虫框架Scrapy实战之批量抓取招聘信息
2015/08/07 Python
使用Python实现文字转语音并生成wav文件的例子
2019/08/08 Python
基于Python检测动态物体颜色过程解析
2019/12/04 Python
台湾菁英交友:结识黄金单身的台湾人
2018/01/22 全球购物
《小草和大树》教学反思
2014/02/16 职场文书
2014迎新年晚会策划方案
2014/02/23 职场文书
法人代表授权委托书
2014/04/08 职场文书
小学生竞选班长演讲稿
2014/04/24 职场文书
大学竞选班干部演讲稿
2014/08/21 职场文书
校园运动会广播稿
2014/10/06 职场文书
老公给老婆的检讨书(精华篇)
2014/10/18 职场文书
2014年小学辅导员工作总结
2014/12/23 职场文书
钱塘江大潮导游词
2015/02/03 职场文书
无故旷工检讨书
2015/08/15 职场文书
创业计划书之面包店
2019/09/17 职场文书