我们经常碰到这样的问题,在v-for循环中,给某些组件(此处以checkBox为例)赋值后,组件并不能正常切换, 这是因为数据层太多,render函数没有自动更新,需手动强制刷新。

解决方法:在切换checkBox等组件时,@change绑定一个方法,在方法中写入以下:

this.$forceUpdate()

this.$forceUpdate(),用于强制刷新页面数据

关于Vue中,checkBox等组件在赋值后,点击切换页面未及时更新问题的更多相关文章

  1. 【Vue】Vue中的父子组件通讯以及使用sync同步父子组件数据

    前言: 之前写过一篇文章<在不同场景下Vue组件间的数据交流>,但现在来看,其中关于“父子组件通信”的介绍仍有诸多缺漏或者不当之处, 正好这几天学习了关于用sync修饰符做父子组件数据双向 ...

  2. vue中的父子组件相互调用

    vue中的父子组件相互调用: 1.vue子组件调用父组件方法:子组件:this.$emit('xx'); 父组件:定义yy方法,并在引用子组件时传参,如@xx="yy" 2.vue ...

  3. Vue中,父组件向子组件传值

    1:在src/components/child/文件夹下,创建一个名为:child.vue的子组件 2:在父组件中,设置好需要传递的数据 3:在App.vue中引入并注册子组件 4:通过v-bind属 ...

  4. vue中使用keepAlive组件缓存遇到的坑

    项目开发中在用户由分类页category进入detail需保存用户状态,查阅了Vue官网后,发现vue2.0提供了一个keep-alive组件. 上一篇讲了keep-alive的基本用法,现在说说遇到 ...

  5. Vue中ajax返回的结果赋值

    这是第二次在项目中遇到此问题,ajax请求成功后在success函数中为Vue实例data里的变量赋值,却失败了 new Vue({ el:'#app', data:{ msg:'' }, creat ...

  6. vue中兄弟之间组件通信

    我们知道Vue中组件之间的通信有很多方式,父子之间通信比较简单,当我们使用vuex时候,兄弟组件之间的通信也很好得到解决 当我们项目较小时候,不使用vuex时候Vue中兄弟组件之间的通信是怎样进行的呢 ...

  7. vue中修改子组件样式

    一.问题叙述 项目里需要新添加一个表单页面,里面就只是几个select,这个几个select是原本封装好的组件,有自己原本的样式,而这次的原型图却没有和之前的样式统一起来,需要微调一下,这里就涉及到父 ...

  8. Vue中iframe和组件的通信

    最近的项目开发中用到了Vue组件中嵌套iframe,相应的碰到了组件和HTML的通信问题,场景如下:demo.vue中嵌入 test.html 由于一般的iframe嵌套是用于HTML文件的,在vue ...

  9. vue中8种组件通信方式, 值得收藏!

    vue是数据驱动视图更新的框架, 所以对于vue来说组件间的数据通信非常重要,那么组件之间如何进行数据通信的呢? 首先我们需要知道在vue中组件之间存在什么样的关系, 才更容易理解他们的通信方式, 就 ...

随机推荐

  1. osgViewer:: Viewer::advance() osg多线程与智能指针

    void ViewerBase::frame(double simulationTime) { if (_done) return; // OSG_NOTICE<<std::endl< ...

  2. MapReduce本地运行模式wordcount实例(附:MapReduce原理简析)

    1.      环境配置 a)        配置系统环境变量HADOOP_HOME b)        把hadoop.dll文件放到c:/windows/System32目录下 c)        ...

  3. MySQL从.ibd文件中恢复数据

    首先,在MySQL命令行下执行如下命令可以查看MySQL中存放数据的位置: show global variables like "%datadir%"; 我这里的执行结果: +- ...

  4. iOS面试-assign与retain

    assign 对基础数据类型 (NSInteger,CGFloat)和C数据类型(int, float, double, char)等等.        此标记说明设置器直接进行赋值,这也是默认值.在 ...

  5. 调用API修改Ocelot的配置文件

    Ocelot是一个基于.net core的开源webapi服务网关开源项目,功能比较强大,Github项目地址为:https://github.com/ThreeMammals/Ocelot,关于Oc ...

  6. 查看某个进程PID对应的文件句柄数量,查看某个进程当前使用的文件句柄数量

    ================================ 1.linux所有句柄查询 lsof -n|awk '{print $2}'|sort|uniq -c |sort -nr|more ...

  7. nginx限流方案的实现(三种方式)

    通过查看nginx官方文档,小弟查看到了三种nginx限流方式. 1.limit_conn_zone 2.limit_req_zone 3.ngx_http_upstream_module 前两种只能 ...

  8. 使用GDAL进行波段分离

    波段分离一般最常用的还是OpenCV,使用OpenCV的split方法可以直接对波段分离,并且效果不错,但是有一个问题是只能处理有限波段的数据,比如波段超过一定的数目就无法完成波段分离工作,或者数据有 ...

  9. 用 Unity 实现调色板功能

    用unity 实现调色板功能. 直接上代码: using UnityEngine; using System.Collections; using UnityEngine.UI; public cla ...

  10. 【miscellaneous】理解Gstreamer架构

    本文给出了Gstreamer的总体设计.通过阅读本文可以了解Gstreamer的内部工作原理.本文编译自gstreamer源码中的文档,原文在源码中的位置是/gstreamer/docs/design ...