|
|
export default { data() { return { isshow: false, viewWidth: 0, buttonWidth: 0, disabledView: false, x: 0, transition: false } }, watch: { show(newVal) { if (this.autoClose) return if (newVal) { this.open() } else { this.close() } }, }, created() { if (this.swipeaction.children !== undefined) { this.swipeaction.children.push(this) } }, beforeDestroy() { this.swipeaction.children.forEach((item, index) => { if (item === this) { this.swipeaction.children.splice(index, 1) } }) }, mounted() { this.isopen = false this.transition = true setTimeout(() => { this.getQuerySelect() }, 50)
}, methods: { onClick(index, item) { this.$emit('click', { content: item, index }) }, touchstart(e) { let { pageX, pageY } = e.changedTouches[0] this.transition = false this.startX = pageX if (this.autoClose) { this.swipeaction.closeOther(this) } }, touchmove(e) { let { pageX, } = e.changedTouches[0] this.slide = this.getSlide(pageX) if (this.slide === 0) { this.disabledView = false }
}, touchend(e) { this.stop = false this.transition = true if (this.isopen) { if (this.moveX === -this.buttonWidth) { this.close() return } this.move() } else { if (this.moveX === 0) { this.close() return } this.move() } }, open() { this.x = this.moveX this.$nextTick(() => { this.x = -this.buttonWidth this.moveX = this.x if(!this.isopen){ this.isopen = true this.$emit('change', true) } }) }, close() { this.x = this.moveX this.$nextTick(() => { this.x = 0 this.moveX = this.x if(this.isopen){ this.isopen = false this.$emit('change', false) } }) }, move() { if (this.slide === 0) { this.open() } else { this.close() } }, onChange(e) { let x = e.detail.x this.moveX = x if (x >= this.buttonWidth) { this.disabledView = true this.$nextTick(() => { this.x = this.buttonWidth }) } }, getSlide(x) { if (x >= this.startX) { this.startX = x return 1 } else { this.startX = x return 0 }
}, getQuerySelect() { const query = uni.createSelectorQuery().in(this); query.selectAll('.viewWidth-hook').boundingClientRect(data => {
this.viewWidth = data[0].width this.buttonWidth = data[1].width this.transition = false this.$nextTick(() => { this.transition = true })
if (!this.buttonWidth) { this.disabledView = true }
if (this.autoClose) return if (this.show) { this.open() } }).exec();
} }}
|
