因为是v-for 循环 出来的，:key = "index" 会出现问题，所以，需要把：key="XXX"换成其他属性就好了。

链接参考：

https://segmentfault.com/q/1010000008276837

https://cn.vuejs.org/v2/guide/list.html#key

vue v-for动画bug的更多相关文章

  1. 四、Vue过渡与动画、过渡css类名、自定义指定、过滤器

    一.过渡 动画 1.1简单的过渡动画使用 parent.vue [0]定义一个待显示的数据 [1]定义一个显示隐藏flag [2]使用动画过滤标签,name用来连接style样式:v-show用来控制 ...

  2. Vue 中的动画特效

    Vue 中的动画特效 CSS 实现标签显隐 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  3. vue & button & refs & click & bug

    vue & button & refs & click & bug $refs.btn.click() ??? vue & refs $refs.btn.$em ...

  4. vue & lifecycle methods & this bug & ES6 Arrow function & this bind bug

    vue & lifecycle methods & this bug ES6 Arrow function & this bind bug bad fetchTableData ...

  5. VUE：过渡&动画

    VUE:过渡&动画 vue动画的理解 1)操作css的 trasition 或 animation 2)vue会给目标元素添加/移除特定的class 3)过渡的相关类名 xxx-enter-a ...

  6. Vue过渡与动画

    通过 Vue.js 的过渡系统,可以在元素从 DOM 中插入或移除时自动应用过渡效果.Vue.js 会在适当的时机为你触发 CSS 过渡或动画,你也可以提供相应的 JavaScript 钩子函数在过渡 ...

  7. Vue学习之动画小结（六）

    一.Vue中实现动画的方式:https://cn.vuejs.org/v2/guide/transitions.html Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果.包括 ...

  8. vue watch & arrow function bug

    vue watch & arrow function bug watch: { GeoJSON: function(newValue, oldValue) { log(`\n\n\nGeoJS ...

  9. vue & template & v-else & v-for bug

    vue & template & v-else & v-for bug nested table bug https://codepen.io/xgqfrms/pen/wvaG ...

  10. Vue过渡和动画效果展示（案例、GIF动图演示、附源码）

    前言 本篇随笔主要写了Vue过渡和动画基础.多个元素过渡和多个组件过渡,以及列表过渡的动画效果展示.详细案例分析.GIF动图演示.附源码地址获取. 作为自己对Vue过渡和动画效果知识的总结与笔记. 因 ...

随机推荐

  1. 【JVM虚拟机】(9)-- JVM是如何处理异常的

    [JVM虚拟机](9)-- JVM是如何处理异常的 上篇博客我们简单说过异常信息是存放在属性表集合中的Code属性表里,那么这篇博客就单独讲Code属性表中的exception_table. 在讲之前 ...

  2. 【原】使用less实现随机下雪动画

    元旦在公司撸码,想起圣诞节的摇摇乐项目有段代码挺有意思的,借着空闲的时间把代码抽出来,沉淀下经验.冬天来了,设计师说摇摇乐的场景需要随机下落的雪花动画,第一时间就想到的方法是canvas比较好,项目非 ...

  3. c# 接口相同方法申明使用

    using System; namespace ConsoleApp1 { interface IInterface1 { void ft(); } interface IInterface2 { v ...

  4. Redis主从同步要深入理解？一篇文章足矣！

    前言: 今天想和大家分享有关 Redis 主从同步(也称「复制」)的内容. 我们知道,当有多台 Redis 服务器时,肯定就有一台主服务器和多台从服务器.一般来说,主服务器进行写操作,从服务器进行读操 ...

  5. springcloud和springboot是什么关系？

    [学习笔记] 4)springcloud和springboot是什么关系? 马克-to-win@马克java社区:springboot可以快速开发单个微服务.springcloud是一个基于sprin ...

  6. 安卓开发笔记（十九）：异步消息处理机制实现更新软件UI

    主界面代码 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:andr ...

  7. 【Android】OkHttp3总结与封装

    开始使用 在app目录下的build.gradle中添加依赖: implementation 'com.squareup.okhttp3:okhttp:3.13.1' implementation ' ...

  8. 如何快速掌握DDT数据驱动测试？

    1.前言 (网盗概念^-^)相同的测试脚本使用不同的测试数据来执行,测试数据和测试行为完全分离, 这样的测试脚本设计模式称为数据驱动.(网盗结束)当我们测试某个网站的登录功能时,我们往往会使用不同的用 ...

  9. 你在为谁工作——IT帮深圳分站2019年3月线下活动回顾

    对于工作,在每个人的心中,它所占的份量都是不一样的.有的人活着是为了工作,有的人工作是为了更好的生活. 在3月24日下午,北京.上海与深圳三地我们同步举办了关于工作这个话题的沙龙活动. 我们深圳分站参 ...

  10. python3 进一步了解装饰器 NLP第四条

    还是先来抄一段NLP第四条: 四,只有感官经验塑造出来的世界,没有绝对的真实世界   每个人运用自己的感觉器官把资料摄入(摄入过程),由于感官运用是主观地有选择性的,因此不能,亦不需要把所有资料捕获. ...