公司做小程序要用mpvue来做，mpvue没有文档肿么办，公司只有我一个前端啊啊啊啊，这下写代码纯属靠猜了 这不遇到问题了，下拉事件怎么整，传统的ui组件会报错……，逼着用小程序原生的组件，写呗，但是触发不了事件啊，心累…… 好不容易弄好了，在这里以<scroll-view>为例子介绍，mpvue使用微信小程序原生组件的方法，真心躺坑过来的，蓝瘦香菇……
小程序官网例子是这样的 官网地址
<view class="section">
<view class="section__title">vertical scroll</view>
<scroll-view scroll-y style="height: 200px;" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll" scroll-into-view="{{toView}}" scroll-top="{{scrollTop}}">
<view id="green" class="scroll-view-item bc_green"></view>
<view id="red" class="scroll-view-item bc_red"></view>
<view id="yellow" class="scroll-view-item bc_yellow"></view>
<view id="blue" class="scroll-view-item bc_blue"></view>
</scroll-view>
<view class="btn-area">
<button size="mini" bindtap="tap">click me to scroll into view </button>
<button size="mini" bindtap="tapMove">click me to scroll</button>
</view>
</view>
mpvue 使用方法
注意点 1.<scroll-view :style="{'height': '300px'}"></scroll-view>要设置高度 2. 举例：小程序原先方法是bindscrolltolower，在mpvue当中要写成@scrolltolower
template 部分
<scroll-view :style=
"{'height':
'300px'}
" :scroll-y="true
" @scrolltolower="scrolltolower
" @scroll="scroll
" >
<div :style="{
'height':
'200px',
'background-color':
'red'}
">tyuiolpo</div>
<div class="" :style="{
'height':
'200px',
'background-color':
'red'}
">dsdsd
</div><div class="" :style="{
'height':
'200px',
'background-color':
'red'}
">grytyju</div>
</scroll-view>
methods 部分
methods: {
scrolltolower(){
console.
log(
7)
},
scroll(e) {
console.
log(
6)
console.
log(e)
},
}
end
