element Carousel走马灯

首先引入js和css

<!-- 引入样式 -->  
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">  
<!-- 引入组件库 -->  
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

接着引入vue

<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>

快速上手

<!-- 轮播图 -->  
<section class="banner">  
    <el-carousel>  
        <el-carousel-item v-for="(item,index) in imgs" :key="index">  
            <img :src="item.src" alt="轮播图">  
        </el-carousel-item>  
    </el-carousel>  
</section>

<script th:inline="javascript">  
    let vue = new Vue({  
        el: "#app"  
        , data: {  
            imgs: [[${contentBanner}]]  
        }  
    });  
</script>

效果如下

这是具体参数和事件