uni-app实现手势登录及绑定微信功能

首先是前端的手势插件下载引用，可以去插件市场搜索，我用的这个
https://ext.dcloud.net.cn/plugin?id=49
下载引入就好了。

一、手势密码设定功能

<template>
	<view class="content">
		<view class="ssmm">
			<mpvue-gesture-lock :containerWidth="590" :cycleRadius="70" @end="onEnd" :password="password"></mpvue-gesture-lock>
		</view>
		<view class="uni-center">{
  {text}}</view>
	</view>
</template>

<script>
	import mpvueGestureLock from '@/components/mpvueGestureLock/indexsz.vue';
	export default {
		components: {
			mpvueGestureLock
		},
		data() {
			return {
				password: [],
				text: '请设定手势'
			}
		},
		onLoad() {//禁用页面下滑功能，不然滑动会带动页面
			document.body.addEventListener('touchmove', bodyScroll, {
			    passive: false
			});
			function bodyScroll(event) {
			    event.preventDefault();
			}
		},
		methods: {
			onEnd(data) {
				var access_token=uni.getStorageSync("access_token");
				if (this.password.length) {
					if (this.password.join('') === data.join('')) {
						this.text = '手势设定完成'
						this.password = [ ]
						uni.request({    //设置完调用接口保存手势密码
							url: getApp().globalData.baseUrl+'/admin/user/updateUserLockpwd',
						    data: { 
								userId:uni.getStorageSync("userId"),
								lockpwd:data.join('-')
							},
							method:"PUT",
						    header: {
								isToken: false,
								'TENANT-ID': getApp().globalData.tenantId,
								'Authorization':'Bearer '+access_token
						    },
						    success: (res) => {
								if(res.data.code==0){
									uni.showToast({
										title: '手势设定完成',
										icon: 'success',
										mask: true
									});
									setTimeout(function() {
										uni.reLaunch({
											url:"../fxcp/cpjg/cpjg"
										})
									},1000);
								}
						    }
						});
						
					} else {
						this.text = '两次手势设定不一致'
						this.password = []
					}
				} else {
					this.text = '请确认手势设定'
					this.password = data//data是密码数字数组
				}
			}
		}
	}
</s