解决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 相关文章推荐
Extjs中ComboBox加载并赋初值的实现方法
Mar 22 Javascript
jQuery隔行变色与普通JS写法的对比
Apr 21 Javascript
js实现图片在未加载完成前显示加载中字样
Sep 03 Javascript
jQuery+HTML5实现手机摇一摇换衣特效
Jun 05 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
Aug 26 Javascript
总结jQuery插件开发中的一些要点
May 16 Javascript
JavaScript实现九九乘法表的简单实例
Jun 07 Javascript
BootStrap智能表单实战系列(三)分块表单配置详解
Jun 13 Javascript
JS字符串按逗号和回车分隔的方法
Apr 25 Javascript
Vue 让元素抖动/摆动起来的实现代码
May 31 Javascript
WebSocket的简单介绍及应用
May 23 Javascript
Vue路由模块化配置的完整步骤
Aug 14 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获取文件名后缀
2013/06/09 PHP
php结合js实现点击超链接执行删除确认操作
2014/10/31 PHP
举例详解PHP脚本的测试方法
2015/08/05 PHP
php array_pop 删除数组最后一个元素实例
2016/11/02 PHP
ThinkPHP中Widget扩展的两种写法及调用方法详解
2017/05/04 PHP
js异或加解密效果代码
2008/06/25 Javascript
Jquery 实现Tab效果 思路是js思路
2010/03/02 Javascript
jquery获取tr中控件值并操作tr实现思路
2013/03/27 Javascript
JavaScript和CSS通过expression实现Table居中显示
2013/06/28 Javascript
javascript中如何处理引号编码&amp;#034;
2013/08/15 Javascript
分享JavaScript获取网页关闭与取消关闭的事件
2013/12/13 Javascript
ExtJS 刷新后如何默认选中刷新前最后一次选中的节点
2014/04/03 Javascript
JavaScript编程中的Promise使用大全
2015/07/28 Javascript
Mvc提交表单的四种方法全程详解
2016/08/10 Javascript
Vue 仿百度搜索功能实现代码
2017/02/16 Javascript
js中作用域的实例解析
2017/03/16 Javascript
nodejs模块学习之connect解析
2017/07/05 NodeJs
vue2.0 父组件给子组件传递数据的方法
2018/01/15 Javascript
vue中使用vue-cli接入融云实现即时通信
2019/04/19 Javascript
JSON stringify方法原理及实例解析
2020/10/23 Javascript
vue video和vue-video-player实现视频铺满教程
2020/10/30 Javascript
Nodejs实现微信分账的示例代码
2021/01/19 NodeJs
一个简单的python程序实例(通讯录)
2013/11/29 Python
python爬虫的工作原理
2017/03/05 Python
Python Django 页面上展示固定的页码数实现代码
2019/08/21 Python
Jupyter安装拓展nbextensions及解决官网下载慢的问题
2021/03/03 Python
西班牙三叶草药房:Farmacias Trébol
2019/05/03 全球购物
《植物妈妈有办法》教学反思
2014/02/25 职场文书
硕士生工作推荐信
2014/03/07 职场文书
公益广告语集锦
2014/03/13 职场文书
生产文员岗位职责
2014/04/05 职场文书
2015年市场营销工作总结
2015/07/23 职场文书
高二数学教学反思
2016/02/18 职场文书
优秀的商业计划书,让融资一步到位
2019/05/07 职场文书
Python使用Beautiful Soup(BS4)库解析HTML和XML
2022/06/05 Python
Oracle中日期的使用方法实例
2022/07/07 Oracle