在项目中，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. angular6 iframe应用

    问题一. iframe如何自适应屏幕高度 解决思路:通过设置iframe外层父元素高度等于window高度,再相对于父元素定位iframe元素:案例如下: 第一步: 模板文件中使用iframe // ...

  2. 夯实Java基础系列11：深入理解Java中的回调机制

    目录 模块间的调用 多线程中的"回调" Java回调机制实战 实例一 : 同步调用 实例二:由浅入深 实例三:Tom做题 参考文章 微信公众号 Java技术江湖 个人公众号:黄小斜 ...

  3. 遇到不支持的 Oracle 数据类型 USERDEFINED

    以前都是sql查询mdb空间数据没有什么问题,今天在用sql方式查询Oracle中的空间数据时候,出现错误.它不支持geometry.空间数据都带有shape属性.只要不查询shape字段就没问题.但 ...

  4. Dropout原理与实现

    Dropout是深度学习中的一种防止过拟合手段,在面试中也经常会被问到,因此有必要搞懂其原理. 1 Dropout的运作方式 在神经网络的训练过程中,对于一次迭代中的某一层神经网络,先随机选择中的一些 ...

  5. vue.js入门代码

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. java基础之泛型对象与json互转

    1. 场景描述 把泛型对象转成字符串放到缓存中,获取后使用有点问题,记录下,有碰到的朋友,参考下. 2. 解决方案 2.1 操作类及说明 /** * @auther: 软件老王 */ public s ...

  7. 斐波那契数列n项的值。（递归和非递归算法Golang实现）

    递归实现: func f(num int) int { if num == 1 || num == 2 { return 1 } return f(num-1) + f(num-2) } 非递归实现: ...

  8. 01 python安装与初识

    一.简要概述 python学习时设计要大于开发. 二.编程语言 1.分类 编程语言分为高级语言和低级语言.高级语言如python.c#,Java.PHP等,低级语言(基础语言)如C.汇编语言. 2.机 ...

  9. Ubuntu安装Chrome浏览器及解决启动no-sandbox问题

    1.安装浏览器 # apt-get install gonme # apt-get update # apt-get install google-chrome-stable 2.启动Chrome浏览 ...

  10. java IO、NIO、AIO详解

    概述 在我们学习Java的IO流之前,我们都要了解几个关键词 同步与异步(synchronous/asynchronous):同步是一种可靠的有序运行机制,当我们进行同步操作时,后续的任务是等待当前调 ...