解决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 相关文章推荐
jQuery AnythingSlider滑动效果插件
Feb 07 Javascript
js写的方法实现上传图片之后查看大图
Mar 05 Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
Jun 23 Javascript
jquery实现侧边弹出的垂直导航
Dec 09 Javascript
JavaScript学习笔记之JS对象
Jan 22 Javascript
jquery实现ajax加载超时提示的方法
Jul 23 Javascript
jQuery实现在新增加的元素上添加事件方法案例分析
Feb 09 Javascript
JS实现的简单拖拽功能示例
Mar 13 Javascript
详解小程序rich-text对富文本支持方案
Nov 28 Javascript
微信小程序实现的一键复制功能示例
Apr 24 Javascript
Vue项目移动端滚动穿透问题的实现
May 19 Javascript
字节飞书面试promise.all实现示例
Jun 16 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/04/11 PHP
Codeigniter中mkdir创建目录遇到权限问题和解决方法
2014/07/25 PHP
PHP生成随机数的方法总结
2018/03/01 PHP
读jQuery之十四 (触发事件核心方法)
2011/08/23 Javascript
JS实现时间格式化的方式汇总
2013/10/16 Javascript
jQuery通过点击行来删除HTML表格行的实现示例
2014/09/10 Javascript
node.js操作mongodb学习小结
2015/04/25 Javascript
JSON字符串转JSON对象
2015/07/31 Javascript
javascript常用函数(2)
2015/11/05 Javascript
JS数组排序技巧汇总(冒泡、sort、快速、希尔等排序)
2015/11/24 Javascript
jQuery实现下拉框左右移动(全部移动,已选移动)
2016/04/15 Javascript
JS传值出现中文参数乱码的解决方法
2016/06/30 Javascript
浅谈JavaScript对象与继承
2016/07/10 Javascript
深入分析node.js的异步API和其局限性
2016/09/05 Javascript
AngularJS模板加载用法详解
2016/11/04 Javascript
Vue实现搜索 和新闻列表功能简单范例
2018/03/16 Javascript
深入理解令牌认证机制(token)
2019/08/22 Javascript
利用JS响应式修改vue实现页面的input值
2019/09/02 Javascript
vue实现短信验证码登录功能(流程详解)
2019/12/10 Javascript
原生js实现文件上传、下载、封装等实例方法
2020/01/05 Javascript
非常漂亮的js烟花效果
2020/03/10 Javascript
JS画布动态实现黑客帝国背景效果
2020/11/08 Javascript
[01:50]WODOTA制作 DOTA2中文宣传片《HERO》
2013/04/28 DOTA
[51:14]LGD vs VP 2018国际邀请赛淘汰赛BO3 第一场 8.21
2018/08/22 DOTA
Python Requests安装与简单运用
2016/04/07 Python
Python实现中文数字转换为阿拉伯数字的方法示例
2017/05/26 Python
Django Aggregation聚合使用方法解析
2019/08/01 Python
python实现飞机大战项目
2020/03/11 Python
详解Django中的FBV和CBV对比分析
2021/03/01 Python
HTML5 audio标签使用js进行播放控制实例
2015/04/24 HTML / CSS
html5关于外链嵌入页面通信问题(postMessage解决跨域通信)
2020/07/20 HTML / CSS
ktv收银员岗位职责
2013/12/16 职场文书
校园环保广播稿(3篇)
2014/09/15 职场文书
自愿离婚协议书范本
2015/01/26 职场文书
2016学习医德医风心得体会
2016/01/25 职场文书
正则表达式基础与常用验证表达式
2022/06/16 Javascript