Prerequisites
First, you should get your Captcha ID and Captcha Div ID
Please visit for more information:
Installation
Install captcha wrapper with npm:
npm i @leminnow/react-lemin-cropped-captcha
Also, you can install captcha wrapper with yarn:
yarn add @leminnow/react-lemin-cropped-captcha
Integration
Lemin Captcha must be placed inside of a “form” element.
Please ensure that your captcha-div-id is the same as the captcha-div-id you’ve set before. If you set a captcha-div-id for your Lemin Captcha in the advanced settings, this div must have that same captcha-div-id. (default: “lemin-cropped-captcha”)
Use LeminCroppedCaptchaContainer in your component:
import {LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";function App() { return ( <div> <form> <LeminCroppedCaptchaContainer containerId={"..."} captchaId={"CROPPED_..."}/> </form> </div> );}
Use captcha methods with Multiple Instances:
import {leminCroppedCaptcha, LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";function getCaptchaValue() { const values = leminCroppedCaptcha.getCaptcha('CROPPED_...').getCaptchaValue()}function App() { return ( <div> <form> <LeminCroppedCaptchaContainer containerId={"..."} captchaId={"CROPPED_..."}/> </form> <button onClick={getCaptchaValue}>Get captcha value</button> </div> );}
Use captcha methods with LeminCroppedCaptcha Object:
import {LeminCroppedCaptcha, LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";
const myCaptcha = new LeminCroppedCaptcha('...', 'CROPPED_...')
function getCaptchaValues() {
const values = myCaptcha.getCaptchaValue();
}
function App() {
return (
<div>
<form>
<LeminCroppedCaptchaContainer
containerId={myCaptcha.containerId}
captchaId={myCaptcha.captchaId}/>
</form>
<button onClick={getCaptchaValues}>Get captcha values</button>
</div>
);
}
Please, find below the example GitHub repository.