這篇文章主要講解了用vue如何實(shí)現(xiàn)手機(jī)觸屏滑動(dòng)功能的代碼示例，內(nèi)容清晰明了，對(duì)此有興趣的小伙伴可以學(xué)習(xí)一下，相信大家閱讀完之后會(huì)有幫助。
成都創(chuàng)新互聯(lián)公司專注于企業(yè)成都全網(wǎng)營(yíng)銷、網(wǎng)站重做改版、嘉禾網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、H5建站、商城開(kāi)發(fā)、集團(tuán)公司官網(wǎng)建設(shè)、成都外貿(mào)網(wǎng)站制作、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)等建站業(yè)務(wù)，價(jià)格優(yōu)惠性價(jià)比高，為嘉禾等各大城市提供網(wǎng)站開(kāi)發(fā)制作服務(wù)。
功能：iview Carousel 走馬燈，我需要在phone上實(shí)現(xiàn)滑動(dòng)切換功能。
重慶分公司
重慶分公司
data() {
return {
phone_mouseMIndex: 0, // phone端 滑動(dòng)索引
phone_mouseMX0: 0, // phone端 滑動(dòng)索引
phone_mouseMX1: 0, // phone端 滑動(dòng)索引
}
},
...
// phone端 滑動(dòng)開(kāi)始
phone_mouseS(e){
this.phone_mouseMX0 = e.changedTouches[0].pageX;
},
// phone端 滑動(dòng)結(jié)束
phone_mouseE(e){
this.phone_mouseMX1 = e.changedTouches[0].pageX;
let tag = this.phone_mouseMX1 - this.phone_mouseMX0;
if(tag >= 50){
if(this.phone_mouseMIndex > 0){
this.phone_mouseMIndex--;
}else{
this.phone_mouseMIndex = 2;
}
}
if(tag <= -50){
if(this.phone_mouseMIndex < 2){
this.phone_mouseMIndex++;
}else{
this.phone_mouseMIndex = 0;
}
}
}
看完上述內(nèi)容，是不是對(duì)用vue如何實(shí)現(xiàn)手機(jī)觸屏滑動(dòng)功能的代碼示例有進(jìn)一步的了解，如果還想學(xué)習(xí)更多內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
