vuede的mint.ui中的swiper组件内容无法显示

Question

引入swiper组件，想做一个幻灯片效果。发现给其父级设置高度可以，但是里面的子项无法设置高度，设置高度以后无效。因为高度设置无效，导致图片显示不出来？

<div id="app"><div>
<mt-swipe :auto="4000"> 
<mt-swipe-item>
<img src="img/01.jpeg" alt="">
</mt-swipe-item> 
<mt-swipe-item>
<img src="img/02.jpeg" alt="">
</mt-swipe-item>
<mt-swipe-item>
<img src="img/03.jpeg" alt="">
</mt-swipe-item>
</mt-swipe>
</div>

对应的html结构如图所示。给swipe-item添加高度。设置无效，请问到底是怎么回事呢？

Answer 1

你需要给 <mt-swipe class="my-swipeimg"> 一个样式,来设置轮播的高度
<style scoped>

.my-swipeimg {

height: 320px;  
color: #fff;
font-size: 30px;
text-align: center;

}

</style>