Vue.js recaptcha

Here's the usage example:
<vm-recaptcha :value.bind="form.recaptcha"></vm-recaptcha>

And you have to include cdn as always. This gist doesn't cover serverside.

<template>
    <div :id="id" value=""></div>
</template>

<script>

    module.exports = {
        data: function () {
            return {
                recaptchaKey: this.$api.load('recaptcha-key'),
            }
        },
        ready: function (){
            this.rerender();
        },
        methods: {
            rerender: function (){
                if (this.recaptchaKey.downloaded && window.grecaptcha !== undefined){
                    window.grecaptcha.render(this.id, {
                        sitekey: this.recaptchaKey.data,
                        callback: function (response){
                            console.log(response);
                            this.value = response;
                        }.bind(this),
                    });
                    return;
                }
                setTimeout(this.rerender.bind(this), 500);
            }
        },
        props: ['value']
    }
</script>

Thanks for sharing. Interesting is it works when captcha reloads after transition, I see you not store id of captcha. There is some recipe for this https://maketips.net/tip/61/recaptcha-with-vuejs-example