vue3-slide-verify滑块验证使用

想加个手机验证，但是签名申请不下来，所以搞了个滑块验证

<template>
  <slide-verify
    :l="42"
    :r="10"
    :w="300"
    :h="200"
    ref="block"
    :imgs="imgs"
    :slider-text="text"
    :accuracy="accuracy"
    @again="onAgain"
    @success="onSuccess"
    @fail="onFail"
    @refresh="onRefresh"
  ></slide-verify>
</template>

<script setup>
import { ref } from "vue";
import SlideVerify from "vue3-slide-verify";
import "vue3-slide-verify/dist/style.css";
import img from "../assets/lianaiqingdan.jpeg";
const block = ref(null);
const imgs = ref([img, img, img, img]);
const text = ref("想要祝福，先过我这一关!");
const emit = defineEmits(["success"]);

const onAgain = () => {
  // 刷新
  block.value?.refresh();
};

const onSuccess = (times) => {
  emit("success");
};

const onFail = () => {
  // 不通过
};

const onRefresh = () => {
  // 点击了小图标
};

const handleClick = () => {
  // 刷新
  block.value?.refresh();
};
</script>

<style scoped lang="scss">
:deep(.slide-verify-slider) {
  border: 0 !important;
  margin-top: 0 !important;
}
</style>