vue el-carousel走马灯实现显示多张（5张）和（7张）

在Vue中使用Element UI的<el-carousel>组件实现多张图片的无缝滚动，可以通过设置type属性为'card'来实现走马灯效果，并通过autoplay属性开启自动播放。

以下是两个示例，分别展示了如何设置显示5张和7张图片：

<template>
  <div>
    <!-- 显示5张图片的走马灯 -->
    <el-carousel :interval="4000" type="card" height="200px" indicator-position="none">
      <el-carousel-item v-for="index in 5" :key="index">
        <img :src="`image-${index}.jpg`" alt="image">
      </el-carousel-item>
    </el-carousel>
 
    <!-- 显示7张图片的走马灯 -->
    <el-carousel :interval="4000" type="card" height="200px" indicator-position="none">
      <el-carousel-item v-for="index in 7" :key="index">
        <img :src="`image-${index}.jpg`" alt="image">
      </el-carousel-item>
    </el-carousel>
  </div>
</template>
 
<script>
export default {
  // 你的组件数据和方法
};
</script>
 
<style>
/* 你的样式 */
</style>

在这个例子中，我们使用了v-for来循环生成对应数量的<el-carousel-item>。interval属性用于设置自动播放的间隔时间，height属性设置走马灯的高度，indicator-position属性用于隐藏指示器。

请确保你的项目中已经安装了Element UI，并正确引入。在<script>标签中引入Element UI，并在Vue实例中使用它。

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
 
Vue.use(ElementUI);

以上代码中的image-${index}.jpg应替换为你实际的图片资源路径。