movable-view动态direction无效果?
发布于 5 年前 作者 mzeng 7756 次浏览 来自 官方Issues

求高手指点,您好,小程序入门阶段,在社区看到您回复movable-view的问题,和我现在的情况很匹配,特此打扰请教下。用movable-view做缩放和拖拽操作,在获得目标区域后长按进行选中,希望长按后手指移动时原图不再被拖拽,尝试了两个方法,都没达到效果:

方法1,采用动态设置direction未能实现效果,结果是在js中把direction设置为none后还是可以拖动;

方法2,尝试了disabled方法,结果是增加了disabled参数后,无论设置为true还是false都无法拖拽。

参考了社区链接未能实现,最下面为我的代码,还请大神指点,万分感谢!!

https://developers.weixin.qq.com/community/develop/doc/000664fd194eb81a5ef8b88a65b400?_at=1617094968350

<template>

&lt;view&gt;



	&lt;movable-area&gt;		



		&lt;movable-view



			class="movable-view"&nbsp;



			:direction="direction"



			out-of-bounds="true"



			[@change](/user/change)="onChange"



			[@longtap](/user/longtap)='longtap'



			[@scale](/user/scale)="onScale"



			scale="true"



			scale-value="1"



			scale-min="1"



			scale-max="4"



			&gt;



			text



		&lt;/movable-view&gt;



	&lt;/movable-area&gt;



&lt;/view&gt;

</template>

<script>

export default{



	data() {



		return {				



			direction:"all",



			disabled:"false",



		}



	},

 

	methods: {			



		//获取长按时的坐标



		longtap(event){



			this.direction = "none"



			console.log(this.direction)



		},



		//响应拖动图片事件



		onChange(event){



			this.direction = "none"



			console.log('123456732')



		},



	}



}

</script>

<style>

movable-view {



	display: flex;



	align-items: center;



	justify-content: center;



	height: 150rpx;



	width: 150rpx;



	background-color: \#007AFF;



	color: \#fff;



}



movable-area {



	height: 700rpx;



	width: 100%;



	background-color: \#D8D8D8;



	overflow: hidden;



}

</style>

回到顶部