vue 快捷轮播组件代码实现

在观看vue实战视频的时候，发现用的插件比较复杂，于是采用Iview组件中的轮播组件。

1 进行iView 依赖的下载

npm install iview --save

2 在main.js进行依赖的引入

import iView from 'iview'import 'iview/dist/styles/iview.css'Vue.use(iView)

3 在需要的页面进行轮播组件的引入

        <Carousel autoplay v-model="value2" loop>          <CarouselItem v-for="item in recommends" :key="item.id">            <a :href="item.linkUrl" class="demo-carousel">              <img :src="item.picUrl">            </a>          </CarouselItem>        </Carousel>

注意使用vue的v-for循环语法的时候，最好加上一个关键字，加以识别。
为了给 Vue 一个提示，以便它能跟踪每个节点的身份，从而重用和重新排序现有元素，你需要为每项提供一个唯一 key 属性。理想的 key 值是每项都有的且唯一的 id。