element跑马灯/轮播图,第一页隐藏左边按钮,最后一页隐藏右边按钮(vue 开箱即用)
图示:
第一步:
<el-carousel :class="changeIndex==0?'leftBtnNone':changeIndex==imgDataList.length-1? 'rightBtnNone':''" height="546px" :autoplay="false" @change="changeNext"><el-carousel-item v-for="(item,index) in imgDataList" :key="index">//内容</el-carousel-item>
</el-carousel>
第二步:
data() {return {imgDataList: [],changeIndex:' '}},
第三步
methods:{changeNext(e){this.changeIndex=e},}
第四步
<style scoped>
/deep/.leftBtnNone {.el-carousel__arrow--left {display: none !important;}
}
/deep/.rightBtnNone {.el-carousel__arrow--right {display: none !important;}
}
</style>