Soy nuevo en reactjs y javascript. Estoy tratando de implementar un temporizador en mi página web. ¿Cómo implemento la función reset() que se llama cuando se hace clic en el botón "Reset Clock"? Espero que el temporizador se restablezca al valor inicial. Proporcione sugerencias para implementar la función de reinicio.

Este es el código que estoy usando:

Aplicación.js:

 import React from 'react'; import ReactDOM from 'react-dom'; import Clock from './CountDown'; class App extends React.Component { clockRef = null; constructor(props) { super(props); this.setClockRef = this.setClockRef.bind(this); this.start = this.start.bind(this); this.pause = this.pause.bind(this); this.reset = this.reset.bind(this); } start() { this.clockRef.start(); } pause() { this.clockRef.pause(); } reset() { } setClockRef(ref) { // When the `Clock` (and subsequently `Countdown` mounts // this will give us access to the API this.clockRef = ref; } render() { return ( <> <button onClick={this.start}>Start Clock</button> <button onClick={this.pause}>Pause Clock</button> <button onClick={this.reset}>Reset Clock</button> <Clock refCallback={this.setClockRef} time="60" /> </> ); } } export default App;

Cuenta regresiva.js:

 import React from 'react'; import Countdown from 'react-countdown'; export default class Clock extends React.Component { render() { const { refCallback, time } = this.props; return ( <Countdown // When the component mounts, this will // call `refCallback` in the parent component, // passing a reference to this `Countdown` component key = {0} ref={refCallback} date={Date.now() + (time * 60000)} intervalDelay={3} zeroPadTime={2} autoStart={false} daysInHours /> ); } }