HAPI Form Mixin for Nuxt with reCAPTCHA + DataLayer

> It will add form data to the dataLayer once the submission is successful.

Installation

NPM
``
npm install hapiform-with-recaptcha
`

Yarn
`
yarn add hapiform-with-recaptcha
`

Usage

set recaptcha-el attribute to an element to rendering reCAPTCHA.
` html



`

package.json
`json
"dependencies": {
"hapiform-with-recaptcha": "^0.0.20",
// ...
}

`

vue/nuxt template
`vue


`

disable reCAPTCHA by setting the recaptchaDisabled to true.




Errors of reCAPTCHA

> use recaptchaError to show the error message of reCAPTCHA.

Busy state


You may make use of the this.busy` state to bind attributes or display loading image to give better user experience.

Allow multiple forms on one page