Estoy tratando de representar un componente como un elemento secundario que pasa los accesorios principales, pero la página no muestra nada, solo blanco. Cuando elimino la parte del código que usa los accesorios, se renderiza. Estoy tratando de pasar una variable de estado y una función. Gracias :)

 const MainButtons = (props) => { const { depositAmount } = props; return ( <div className="container1"> <form className="deposit" onSubmitCapture={(event) => { event.preventDefault(); const depositAmount = depositAmount; props.deposit(depositAmount); }} > <input type="text" className="inputs" placeholder="Amount to deposit" ref={(input) => (depositAmount = input)} /> <button className="btnS btnS-colored"> <BsArrowBarUp /> Send </button> </form> </div> ); };

Y el padre hace esto:

 <MainButtons depositAmount={this.state.depositAmount} deposit={this.deposit} />