wenlng / go-captcha-vue

This is the vue package for go-captcha
MIT License
37 stars 18 forks source link

请帮忙看看我的使用方式是否存在问题 #3

Closed dodois closed 2 days ago

dodois commented 3 weeks ago

example


<gocaptcha-click v-if="captcha.type == 'ClickBasic' || captcha.type == 'ClickShape'"
:data="captcha.data" :events="captchaEvents[captcha.type]" />
<gocaptcha-slide v-if="captcha.type == 'SlideBasic'" :data="captcha.data"
:events="captchaEvents[captcha.type]" />
<gocaptcha-slide-region v-if="captcha.type == 'SlideRegion'" :data="captcha.data"
:events="captchaEvents[captcha.type]" />
<gocaptcha-rotate v-if="captcha.type == 'RotateBasic'" :data="captcha.data"
:events="captchaEvents[captcha.type]" />

import { captchaEvents } from 'captcha.js'

data() { captchaEvents, captcha: { type: 'ClickBasic', data: { image: "data:image/jpeg;base64,/9j/2wCEAAEBAQEBAQEBAQEBAQ" thumb: "data:image/jpeg;base64,/9j/2wCEAAEBAQEBAQEBAQEBAQ" } } }


>captcha.js
```javascript
export const captchaEvents = {
    ClickBasic: {
        click(x, y) {
            console.log("click >>>>>>>", x, y)
        },
        confirm(dots, clear) {
            console.log("dots >>>>>>>", dots)

            setTimeout(() => {
                clear()
            }, 100)
        },
        refresh() {
            console.log("refresh >>>>>>>")
            // clickData.image = clickImage2
        },
        close() {
            console.log("close >>>>>>>")
        },
    },
    ClickShape: {
        click(x, y) {
            console.log("click >>>>>>>", x, y)
        },
        confirm(dots, clear) {
            console.log("dots >>>>>>>", dots)

            setTimeout(() => {
                clear()
            }, 100)
        },
        refresh() {
            console.log("refresh >>>>>>>")
            // clickData.image = clickImage2
        },
        close() {
            console.log("close >>>>>>>")
        },
    },
    SlideBasic: {
        move(x, y) {
            console.log("move >>>>>>>", x, y)
        },
        refresh() {
            console.log("refresh >>>>>>>")
            // slideData.thumbX = 40
            // slideData.thumbY = 60
            // slideData.image = clickImage2
        },
        close() {
            console.log("close >>>>>>>")
        }
    },

    SlideRegion: {
        move(x, y) {
            console.log("move >>>>>>>", x, y)
        },
        refresh() {
            console.log("refresh >>>>>>>")

            // slideRegionData.thumbX = 40
            // slideRegionData.thumbY = 60
            // slideRegionData.image = clickImage2
        },
        close() {
            console.log("close >>>>>>>")
        }
    },
    RotateBasic: {
        rotate(angle) {
            console.log("rotate >>>>>>>", angle)
        },
        refresh() {
            console.log("refresh >>>>>>>")
            // rotateData.image = clickImage2
        },
        close() {
            console.log("close >>>>>>>")
        }
    }
}

为什么总是报错 [Vue warn]: Error in render: "TypeError: Cannot read properties of undefined (reading 'clickEvent')"

wenlng commented 3 weeks ago

哈喽,看着是 beta 版本的 gocaptcha-button 的 clickEvent 事件没传递问题,正式版已发布了,你使用正式版本就好