Timer

The Timer component displays a timer that will trigger a predefined callback when the time is up. An example use case is for the timing of quizzes.

Example:

<Timer 
    id='test-quiz'
    active={true} 
    duration={50} 
    onTimeUp={() => {
      alert( 'done' );
    }}
/>

Open interactive preview

Options:

  • active | boolean (required): flag that can be toggled to start or pause the timer. Default: none.
  • duration | number (required): duration in seconds for the timer. Default: none.
  • id | string (required): the unique string ID for the timer. The timer component is persistent over page refreshes. Default: none.
  • style | object: CSS inline styles. Default: {}.
  • onTimeUp | function: Callback invoked when the timer runs out. Default: onTimeUp() {}.

results matching ""

    No results matching ""