解决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类型转换方法及需要注意的问题小结(挺全面)
Nov 11 Javascript
一个JavaScript的求爱小特效
May 09 Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
Jun 16 Javascript
js动态改变select选择变更option的index值示例
Jul 10 Javascript
node.js中的fs.lstat方法使用说明
Dec 16 Javascript
JavaScript的代码编写格式规范指南
Dec 07 Javascript
设置jQueryUI DatePicker默认语言为中文
Jun 04 Javascript
bootstrap的3级菜单样式,支持母版页保留打开状态实现方法
Nov 10 Javascript
微信小程序自定义弹出模态框禁止底部滚动功能
Mar 09 Javascript
小程序按钮避免多次调用接口和点击方案实现(不用showLoading)
Apr 15 Javascript
基于vue 动态菜单 刷新空白问题的解决
Aug 06 Javascript
解决Vue-Router升级导致的Uncaught (in promise)问题
Aug 07 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多个版本的分析解释
2011/07/21 PHP
详解HTTP Cookie状态管理机制
2016/01/14 PHP
PHP-FPM实现性能优化
2016/03/31 PHP
PHP文件系统管理(实例讲解)
2017/09/19 PHP
prototype.js的Ajax对象
2006/09/23 Javascript
IE Firefox 使用自定义标签的区别
2009/10/15 Javascript
Jquery 获得服务器控件值的方法小结
2010/05/11 Javascript
javaScript 利用闭包模拟对象的私有属性
2011/12/29 Javascript
JS实现图片翻书效果示例代码
2013/09/09 Javascript
JS Array创建及concat()split()slice()的使用方法
2016/06/03 Javascript
JS高仿抛物线加入购物车特效实现代码
2017/02/20 Javascript
node前端模板引擎Jade之标签的基本写法
2018/05/11 Javascript
Iview Table组件中各种组件扩展的使用
2018/10/20 Javascript
JavaScript链式调用实例浅析
2018/12/19 Javascript
JavaScript数据结构与算法之基本排序算法定义与效率比较【冒泡、选择、插入排序】
2019/02/21 Javascript
详解如何理解vue的key属性
2019/04/14 Javascript
Vue 进阶之路(三)
2019/04/18 Javascript
Vue+Express实现登录注销功能的实例代码
2019/05/05 Javascript
EasyUI 数据表格datagrid列自适应内容宽度的实现
2019/07/18 Javascript
VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决
2020/09/27 Javascript
python3.3教程之模拟百度登陆代码分享
2014/01/16 Python
python正常时间和unix时间戳相互转换的方法
2015/04/23 Python
深入理解Python中的*重复运算符
2017/10/28 Python
Python机器学习logistic回归代码解析
2018/01/17 Python
在Python中利用pickle保存变量的实例
2019/12/30 Python
详解pycharm连接不上mysql数据库的解决办法
2020/01/10 Python
结合CSS3的布局新特征谈谈常见布局方法
2016/01/22 HTML / CSS
哥伦比亚最大的网上商店:Linio哥伦比亚
2016/09/25 全球购物
Made in Design英国:设计家具、照明、家庭装饰和花园家具
2019/09/24 全球购物
广州盈通面试题
2015/12/05 面试题
大学生优秀的自我评价分享
2013/10/22 职场文书
3.12植树节活动总结2014
2014/03/13 职场文书
货车司机岗位职责
2014/03/18 职场文书
解除劳动合同协议书
2014/04/14 职场文书
母亲节演讲稿
2014/05/27 职场文书
《称赞》教学反思
2016/02/17 职场文书