<el-carousel>标签
时间: 2023-06-12 15:07:11 浏览: 268
`<el-carousel>` 是饿了么团队开发的基于 Vue.js 的轮播组件。它提供了多种轮播效果、自动播放、响应式布局等功能。例如,可以使用 `<el-carousel>` 显示商品轮播图,新闻轮播等。
以下是一个简单的示例,使用 `<el-carousel>` 显示三张图片:
```html
<template>
<el-carousel :interval="4000">
<el-carousel-item>
<img src="https://picsum.photos/800/300/?image=1" alt="">
</el-carousel-item>
<el-carousel-item>
<img src="https://picsum.photos/800/300/?image=2" alt="">
</el-carousel-item>
<el-carousel-item>
<img src="https://picsum.photos/800/300/?image=3" alt="">
</el-carousel-item>
</el-carousel>
</template>
```
在这个示例中,使用 `interval` 属性设置轮播的时间间隔,默认为 3000ms。`<el-carousel-item>` 包裹着每一张轮播图片或内容。需要注意的是,`<el-carousel>` 和 `<el-carousel-item>` 都需要引入对应的组件库。
阅读全文