解决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 相关文章推荐
Firefox div高度自适应
Apr 28 Javascript
图片上传即时显示缩略图的js代码
May 27 Javascript
jQuery 通过事件委派一次绑定多种事件,以减少事件冗余
Jun 30 Javascript
jQuery中使用了document和window哪些属性和方法小结
Sep 13 Javascript
自己用jQuery写了一个图片的马赛克消失效果
May 04 Javascript
jQuery实现Tab菜单滚动切换的方法
Sep 21 Javascript
jQuery中设置form表单中action值的实现方法
May 25 Javascript
深入理解javascript函数参数与闭包
Dec 12 Javascript
js实现4个方向滚动的球
Mar 06 Javascript
bootstrap timepicker在angular中取值并转化为时间戳
Jun 13 Javascript
JS函数进阶之继承用法实例分析
Jan 15 Javascript
Vue前端判断数据对象是否为空的实例
Sep 02 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
Pain 全世界最小最简单的PHP模板引擎 (普通版)
2011/10/23 PHP
php获取目标函数执行时间示例
2014/03/04 PHP
Yii框架中memcache用法实例
2014/12/03 PHP
php表单文件iframe异步上传实例讲解
2017/07/26 PHP
阿里云的WindowsServer2016上部署php+apache
2018/07/17 PHP
非常好的js代码
2006/06/27 Javascript
Jquery 基础学习笔记
2009/05/29 Javascript
GWT中复制到剪贴板 js+flash实现复制 兼容性比较好
2010/03/07 Javascript
一款Jquery 分页插件的改造方法(服务器端分页)
2011/07/11 Javascript
得到form下的所有的input的js代码
2013/11/07 Javascript
jQuery中not()方法用法实例
2015/01/06 Javascript
jquery实现鼠标拖拽滑动效果来选择数字的方法
2015/05/04 Javascript
JavaScript实现点击文字切换登录窗口的方法
2015/05/11 Javascript
js图片上传的封装代码
2017/08/01 Javascript
利用jQuery实现简单的拖曳效果实例代码
2017/10/20 jQuery
JavaScript屏蔽Backspace键的实现代码
2017/11/02 Javascript
nodejs连接mysql数据库及基本知识点详解
2018/03/20 NodeJs
layui获取选中行数据的实例讲解
2018/08/19 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
JavaScript基础之this和箭头函数详析
2019/09/05 Javascript
JS中箭头函数与this的写法和理解
2021/01/14 Javascript
python常用web框架简单性能测试结果分享(包含django、flask、bottle、tornado)
2014/08/25 Python
python自然语言编码转换模块codecs介绍
2015/04/08 Python
Python下线程之间的共享和释放示例
2015/05/04 Python
python转换字符串为摩尔斯电码的方法
2015/07/06 Python
通过python的matplotlib包将Tensorflow数据进行可视化的方法
2019/01/09 Python
Python3.5文件读与写操作经典实例详解
2019/05/01 Python
python使用gdal对shp读取,新建和更新的实例
2020/03/10 Python
阿拉伯世界最大的电子商务网站:Souq沙特阿拉伯
2016/10/28 全球购物
奢华时尚的独特视角:La Garçonne
2018/06/07 全球购物
编程实现当输入某产品代码则打印出该产品记录的功能
2014/05/03 面试题
优秀毕业大学生推荐信
2013/11/13 职场文书
办公室人员先进事迹
2014/01/27 职场文书
家长会欢迎词
2015/01/23 职场文书
兼职安全员岗位职责
2015/02/15 职场文书
新生开学寄语大全
2015/05/28 职场文书