Vue拼圖驗證組件使用教程

找一個你需要的
我這里選擇的是控制誤差的demo用。

使用方法：

npm i vue-puzzle-verification

在mian.js中引入

import PuzzleVerification from 'vue-puzzle-verification'
Vue.use(PuzzleVerification )

　　

  <div class="login-box">
             <div class="puzzle-box">
                 <PuzzleVerification
                    v-model="isVerificationShow4"
                    :puzzleImgList="puzzleImgList"
                     deviation="20"
                     blockType="puzzle"
                    :onSuccess="handleSuccess"
                    />
              </div>
       </div>

登錄頁面使用后會出現報錯問題。

同事說是因為監聽沒有銷毀…
所以

 beforeDestory(){
       document.removeEventListener("mousemove",this.moving);
       document.removeEventListener("touchmove",this.moving);
       document.removeEventListener("mouseup",this.moveEnd);
       document.removeEventListener("touchend",this.moveEnd)
    },