123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160 |
- 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();
- }
- }
- }
|