import WmScrollView from '@/components/scroll-view'
<wm-scroll-view :scroll-x="true" @scroll="demoScroll"></wm-scroll-view>
import WmScrollView from '@/components/scroll-view'
<wm-scroll-view class="scroll-view_H" ref="demo" :scroll-x="true" @scroll="demoScroll" @down="demoDown">
<div class="scroll-view-item_H demo-text-1">1</div>
<div class="scroll-view-item_H demo-text-2">2</div>
<div class="scroll-view-item_H demo-text-3">3</div>
</wm-scroll-view>
.scroll-view_H{
white-space: nowrap;
height: 50px;
}
.scroll-view-item_H{
display: inline-block;
width: 50%;
height: 100%;
}
.demo-text-1{background-color: green;}
.demo-text-2{background-color: blueviolet;}
.demo-text-3{background-color: orange;}
export default {
methods:{
/* 监听滚动 */
demoScroll(res){
console.log(res);
},
/* 下拉 */
demoDown(res){
console.log(res);
},
/* 指定位置 */
demoCilck(){
this.$refs.demo.scrollTo('max');
},
},
}
业务咨询
技术问题