在项目中，v-for渲染列表失败，无报错，数组有数据。上网查，好多说是因为动态绑定class的原因，但是经过几番测试，都无效果。

在经过不断尝试，搜索，终于找到原因所在。

问题原因：在v-for循环中，如果我们在函数中改变了item中的值，在console.log()中查看是修改成功了，但在页面中没有及时刷新改变后的值。

解决方法：使用vue自带的 this.$forceUpdate() 迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件，而不是所有子组件。

但是目前具体原因未知，还需要继续查找。因为之前使用v-for从未出现过这个bug。

vue项目中v-for渲染失败的更多相关文章

  1. Vue项目中v-for无法渲染数据

    在Vue项目中,我们想要实现下面的布局效果 后端返回的数据格式如下,可以看出产品列表五张图的数据位于同一个数组中 而我的html结构如下: 我希望直接渲染左边一张大图,然后右边的四张小图通过v-for ...

  2. vue项目中微信jssdk在ios签名失败

    一.问题描述 1. vue项目中微信jssdk签名时,在安卓和ios是有差异的,签名时使用的url=window.location.href.split('#')[0],此时在安卓没问题,在ios会导 ...

  3. 如何在Vue项目中使用Typescript

    0.前言 本快速入门指南将会教你如何在Vue项目中使用TypeScript进行开发.本指南非常灵活,它可以将TypeScript集成到现有的Vue项目中任何一个阶段. 1.初始化项目 首先,创建一个新 ...

  4. Vue项目中出现Loading chunk {n} failed问题的解决方法

    最近有个Vue项目中会偶尔出现Loading chunk {n} failed的报错,报错来自于webpack进行code spilt之后某些bundle文件lazy loading失败.但是这个问题 ...

  5. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

  6. 在vue项目中使用canvas-nest.js，报parameter 1 is not of type 'Element'

    canvas-nest.js是一款轻量的网页特效,如图: github地址:https://github.com/hustcc/canvas-nest.js 在普通的html项目中,只要将<sc ...

  7. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

  8. 在vue项目中的axios使用配置记录

    默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...

  9. 实战：vue项目中导入swiper插件

    版本选择 swiper是个常用的插件,现在已经迭代到了第四代:swiper4.常用的版本是swiper3和swiper4,我选择的是swiper3. 安装 安装swiper3的最新版本3.4.2: n ...

随机推荐

  1. Flask基础(12)-->请求上下文和应用上下文

    请求上下文和应用上下文 请求上下文:可以简单理解为客户端与服务器之间数据交互请求的容器 请求上下文对象有:request.Session request:封装了HTTP请求的内容,针对的是http的请 ...

  2. 蓝松短视频SDK基本功能免费列表

    下载地址:https://github.com/LanSoSdk/LanSoEditor_common 功能免费. 个人和公司都可以商用,不需要和我们说明. 直接下载, 直接去用既可. 完全不需要和我 ...

  3. php常用函数（第一版）

    1.array_slice 作用:数组分页函数 案例:$output  =  array_slice ( $input , - 2 ,  1 ); 2.array_column 作用:数组根据值取出一 ...

  4. JS的加减乘除高精度

    //除法函数,用来得到精确的除法结果 //说明:javascript的除法结果会有误差,在两个浮点数相除的时候会比较明显.这个函数返回较为精确的除法结果. //调用:accDiv(arg1,arg2) ...

  5. 访问http接口时返回502 Bad Getway什么原因怎么解决

    使用 httpclient 工具通过代理服务器请求第三方http 接口,多次返回 502 Bad Getway,少数返回正常. 502 Bad Getway是什么意思? 502 Bad Gateway ...

  6. iptables详解之filter

    iptables详解之filter iptables令很多小伙伴脑阔疼,下面我们来说说如何使用iptables. 一.iptables格式 1.1.iptables 帮助 通过iptables --h ...

  7. CentOS 7 单机安装Redis Cluster（3主3从）

    首先,本篇要基于单实例的安装,你的机器上已经有一个Redishttps://gper.club/articles/7e7e7f7ff7g5egc4g6b 为了节省机器,我们直接把6个Redis实例安装 ...

  8. session与cookie,django中间件

    0819自我总结 一.session与cookie 1.django设置session request.session['name'] = username request.session['age' ...

  9. 详细解读 Spring AOP 面向切面编程（一）

    又是一个周末, 今天我要和大家分享的是 AOP(Aspect-Oriented Programming)这个东西,名字与 OOP 仅差一个字母,其实它是对 OOP 编程方式的一种补充,并非是取而代之. ...

  10. CF991D Bishwock

    CF991D Bishwock 题目描述 给一个$2\times n$的网格,上面一些位置以及被覆盖上了.现在你有一种形状为L的小块,每个由三个小格组成,构成L型 现在问你,当前的网格最多还能摆多少小 ...