v-for在嵌套时index没办法重复用，内循环与外循环不能共用一个index

<swiper-item v-for="(items,index) in swiperList" :key="index">

    <div v-for="item in items" class="swiper-info" :key="item.id" @click="choose" >

        <image :src="item.url"  class="swiper-image" :style="styleObject"/>

    </div>

</swiper-item>

解决办法:给内循环再加上另一个索引

<swiper-item v-for="(items,index) in swiperList" :key="index">

    <div v-for="(item,i) in items" class="swiper-info" :key="i" @click="choose" >

        <image :src="item.url"  class="swiper-image" :style="styleObject"/>

    </div>

</swiper-item>

Vue学习陷阱的更多相关文章

  1. Vue学习笔记-2

    前言 本文非vue教程,仅为学习vue过程中的个人理解与笔记,有说的不正确的地方欢迎指正讨论 1.computed计算属性函数中不能使用vm变量 在计算属性的函数中,不能使用Vue构造函数返回的vm变 ...

  2. Vue学习笔记-1

    前言 本文不是Vue.js的教程,只是一边看官网Vue的教程文档一边记录并总结学习过程中遇到的一些问题和思考的笔记. 1.vue和avalon一样,都不支持VM初始时不存在的属性 而在Angular里 ...

  3. Vue学习记录第一篇——Vue入门基础

    前面的话 Vue中文文档写得很好,界面清爽,内容翔实.但文档毕竟不是教程,文档一上来出现了大量的新概念,对于新手而言,并不友好.个人还是比较喜欢类似于<JS高级程序设计>的风格,从浅入深, ...

  4. Vue学习-01

    1.vue 学习 v-bind:title 数据绑定 v-if 判断显示或者隐藏 <div id="app-3"> <p v-if="seen" ...

  5. vue学习之vue基本功能初探

    vue学习之vue基本功能初探: 采用简洁的模板语法将声明式的将数据渲染进 DOM: <div id="app"> {{ message }} </div> ...

  6. vue学习第一篇 hello world

    计划近期开始学习vue.js.先敲一个hello wolrd作为开始. <!DOCTYPE html> <html lang="en"> <head& ...

  7. vue学习心得

    前言 使用vue框架有一段时间了,这里总结一下心得,主要为新人提供学习vue一些经验方法和项目中一些解决思路. 文中谨代表个人观点,如有错误,欢迎指正. 环境搭建 假设你已经通读vue官方文档(文档都 ...

  8. vue学习笔记（二）——简单的介绍以及安装

    学习编程需要的是 API+不断地练习^_^ Vue官网:https://cn.vuejs.org/ 菜鸟教程:http://www.runoob.com/vue2/vue-tutorial.html ...

  9. vue学习目录 vue初识 this指向问题 vue组件传值 过滤器 钩子函数 路由 全家桶 脚手架 vuecli element-ui axios bus

    vue学习目录 vue学习目录 Vue学习一之vue初识 Vue学习二之vue结合项目简单使用.this指向问题 Vue学习三之vue组件 Vue学习四之过滤器.钩子函数.路由.全家桶等 Vue学习之 ...

随机推荐

  1. java 11 移除的一些其他内容，更简化的编译运行程序，Unicode 10，移除了不太使用的JavaEE模块和CORBA技术，废除Nashorn javascript引擎，不建议使用Pack200 相关api

    移除的一些其他内容 移除项 移除了com.sun.awt.AWTUtilities 移除了sun.misc.Unsafe.defineClass, 使用java.lang.invoke.MethodH ...

  2. go Test的实现 以及 压力测试

    引用 import "testing" 一些原则 文件名必须是 *_test.go* 结尾的,这样在执行 go test 的时候才会执行到相应的代码 必须 import testi ...

  3. python 学习地址

    本章主要记录学习python过程中借鉴的一些网站,并感谢这些博主辛勤付出. python官网:https://www.python.org/ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ...

  4. dom4j,json,pattern性能对比【原】

    报文大概2000字节,对比时为只取其中某个节点的值即可. 以下对比可知取少量节点时pattern性能是远大于dom4j,和json的, 但取大量的时候就不能这么以偏概全了. dom4j和pattern ...

  5. Client-Side Template Injection with AngularJS

    <html> <head> <meta charset="utf-8"> <script src="https://cdn.bo ...

  6. WPF中的常用布局

    一 写在开头1.1 写在开头评价一门技术的好坏得看具体的需求,没有哪门技术是面面俱到地好. 1.2 本文内容本文主要内容为WPF中的常用布局,大部分内容转载至https://blog.csdn.net ...

  7. HTML（二）HTML元素（整体结构，块级元素，内联元素，结构元素，交互元素，元素嵌套规则）

    HTML整体结构解释 <!DOCTYPE html> // 文件应以"<!DOCTYPE ......>"首行顶格开始,推荐使用"<!DOC ...

  8. SpringBoot系列: 制作Docker镜像的全过程

    本文主要参考了 https://segmentfault.com/a/1190000016449865 , 感谢作者的付出. 另外,  在本文中, 演示了Windows+Maven+Docker To ...

  9. Python3:OOP Demo

    方便快速回顾Python的OOP语法 ###################### # 类的私有专有方法 # ###################### # __init__ : 构造函数,在生成对 ...

  10. 过滤器实现 （cookie认证）

    cookie用来做身份认证,非常好用,只需要设置Authentication和Authorization就行了. 但是 ,如果cookie不能用了,怎么办?  不要紧,我们也可以用过滤器进行身份认证. ...