开发条件:使用cube-ui中的cube-slide开发公告栏,文字上下滑动,上下滚动效果的功能
开发过程中遇到的问题:
- 在开发中遇到功能性的问题最先思索,该功能组件能否使用安装的UI中的组件去开发完成
- 阅读官方文档,因为我只是粗略的的看了一遍,导致我写的cube-slide轮播没有将cube-slide-item里面的noticeList数组给循环出来,原因是我没有在cube-slide组件中给data属性传入我要循环的noticeList数组
- 我的开发条件是竖列展示两条公告信息(可以一次显示多个slides),因为我实在没有找到cube-slide组件中类似swiper的slidesPerView配置项,控制slide一次显示多个,所以我就修改的cube-slide的样式让它的overflow: initial;
- 因为我的开发条件是竖向向上轮播,所以配置的轮播方向是direction:vertical
以上就是我个人开发中的总结,谢谢观看!!!
以下是代码以及样式:
<div class="notice">
<div class="notice-wrap">
<div class="notice-fl">
<p>公告</p>
<p>通知</p>
</div>
<div class="notice-fr notice-list">
<div class="notice-list-warp">
<cube-slide