欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

alloytouch vue 使用

錢斌斌2年前9瀏覽0評論

AlloyTouch Vue是一款基于AlloyTouch插件的vue移動端手勢庫,適用于大多數常用的手勢事件,如拖動、滑動、縮放等。下面介紹一下如何在vue項目中使用AlloyTouch Vue。

首先需要安裝alloytouch和alloytouch-vue:

npm install alloytouch alloytouch-vue --save

在需要使用手勢操作的組件中引入AlloyTouchVue:

<template>
<div class="wrapper" @touchstart="start">
<div class="content">{{ content }}</div>
</div>
</template>
<script>
import AlloyTouchVue from 'alloytouch-vue';
import AlloyTouch from 'alloytouch';
export default {
components: {
AlloyTouchVue
},
data () {
return {
content: 'AlloyTouch Vue'
}
},
methods: {
start () {
console.log('start')
}
},
mounted () {
let wrapperDiv = this.$el.querySelector('.wrapper')
this.alloyTouch = new AlloyTouch({
touch: wrapperDiv,
target: wrapperDiv.children[0],
property: 'translateY',
initialValue: 0,
min: window.innerHeight - wrapperDiv.clientHeight,
max: 0,
factor: 1.5,
spring: true,
touchStart: () =>console.log('touchStart'),
touchMove: () =>console.log('touchMove'),
touchEnd: () =>console.log('touchEnd')
})
}
}
</script>

在組件中加入AlloyTouchVue標簽即可對該組件進行手勢操作,同時需要在mounted鉤子函數中創建一個AlloyTouch實例,進行手勢操作的具體配置。

以上是如何在vue項目中使用AlloyTouch Vue的方法,希望對大家有所幫助。