vue 手势解锁功能

效果

实现

 
<template>
  <div class="flex flex-center flex-column">
    <BaseHead title="test">BaseHead>
    <h1>vue手势解锁功能h1>
    <canvas class="canvas" ref="canvasRef" @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend">canvas>
  div>
template>
 
<style lang="scss" scoped>
.page{
  width: 100vw;
  height: 100vh;
  box-sizing: border-box;
  overflow: hidden;
}
.canvas {
  position: fixed;
  top: 400px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #ccc;
}
style>