vue 移動端仿hover事件
阿新 • • 發佈:2018-12-06
vue2.0的移動端的touch事件
touch的開始事件是@touchstart,
移動過程是@touchmove,
結束事件是@touchend
模仿hover效果,在PC端就是滑鼠移入移出的效果,在移動端就是手指按下開始和結束的過程,上程式碼
<input class="immediately-btn" :class="{touchColor:whether}" type="button" value="立即領取" @touchstart="touchstart()" @touchend="touchend()">
css中給按鈕設定一個顏色,touchColor是按下的顏色,wheter剛開始預設的是false
export default {
data(){
return{
whether:false
}
},
methods:{
touchstart(){
this.whether = true;
},
touchend(){
this.whether = false;
}
}
}