React Turnstile - useRef methods

useRef methods

The library exposes some methods within the Turnstile ref, in order to interact with the widget.

Method	Description	Returns
`getResponse()`	Returns the widget’s response token.	`string`
`getResponsePromise()`	Returns the widget’s response as a promise, it waits until the widget is rendered and solved. It has a timeout of 30 seconds.	`Promise<string>`
`reset()`	Resets the widget. Useful if a given widget has timed out, expired or needs to be reloaded.	`void`
`remove()`	Fully removes the Turnstile widget from the DOM.	`void`
`render()`	Renders the widget. Since all widgets are rendered automatically, this only takes effect if the widget was previously removed. If the widget is already rendered, this method will not re-render the widget.	`void`
`execute()`	If `options.execution` is set to `'execute'`, this method is used to render the widget. If the widget is already shown (rendered and executed), this method will not re-render the widget. If the widget got removed (`.remove()`), you need to call `.render()` and then `.execute()`. If `options.execution` is set to `'render'` (default), this method has no effect.	`void`
`isExpired()`	Returns `true` if the widget has expired.	`boolean`

import { Turnstile } from '@marsidev/react-turnstile'

export default function Widget() {
  const ref = React.useRef()

  return (
    <>
      <Turnstile ref={ref} siteKey='1x00000000000000000000AA' />
      <button onClick={ref.current?.reset}>Reset widget</button>
    </>
  )
}

import { Turnstile } from '@marsidev/react-turnstile'
import type { TurnstileInstance } from '@marsidev/react-turnstile'

export default function Widget() {
  const ref = React.useRef<TurnstileInstance | null>(null)

  return (
    <>
      <Turnstile ref={ref} siteKey='1x00000000000000000000AA' />
      <button onClick={ref.current?.reset}>Reset widget</button>
    </>
  )
}

Examples

useRef methods

On this page