组件-Element—Carousel（走马灯）

最新推荐文章于 2024-09-13 22:20:16 发布

ForeverJPB.

最新推荐文章于 2024-09-13 22:20:16 发布

阅读量3.4k

点赞数

分类专栏：组件---Element 文章标签： Element

本文链接：https://blog.csdn.net/GU_AO_SHI_TAI_DU/article/details/94618556

版权

本文详细介绍了Element UI中的Carousel组件，包括基础用法、如何使用指示器和切换箭头、实现卡片化展示以及设置切换方向。同时，还列举了Carousel组件的相关属性、事件和方法，以及Carousel-Item的属性。

摘要由CSDN通过智能技术生成

组件-Element—Carousel（走马灯）

组件— 走马灯

基础用法

<template>
  <div class="block">
    <span class="demonstration">默认 Hover 指示器触发</span>
    <el-carousel height="150px">
      <el-carousel-item v-for="item in 4" :key="item">
        <h3 class="small">{
    { item }}</h3>
      </el-carousel-item>
    </el-carousel>
  </div>
  <div class="block">
    <span class="demonstration">Click 指示器触发</span>
    <el-carousel trigger="click" height="150px">
      <el-carousel-item v-for="item in 4" :key="item">
        <h3 class="small">{
    { item }}</h3>