Soy novato en reaccionar. Pregunté hace unos días sobre la carga en la imagen modificando el botón a través de algún div. He pensado hacerlo por ganchos (basado en mi investigación)

Uno de los usuarios me ha sugerido que use la etiqueta y use el atributo htmlFor usando la misma identificación utilizada en el archivo de tipos de entrada.

Lo he usado, pero el problema es que en mi imagen archivada en el estado en el que estoy usando para almacenar, la cadena cargada en base64 se eliminó debido a algún tipo de burbujeo de eventos o por alguna otra razón. En el envío final, no obtuve la imagen en el estado.

Descubrí que el uso de Label generará algunas burbujas y mi imagen en estado se actualizará con el valor predeterminado

Esta es mi implementación:

 constructor(props, context) { super(props, context); } postQuery=()=> { // This function trigger when final submit button is clicked and here i am not getting the image key with value in state. console.log('Final State: ', this.state); // Here i need the image in state // Other task is dependent on this.state.image; // ---> base64 string; } uploadImage()=> { // here I am getting the file which is selected by the user from frontend. // some function which return the image base64 string let fileToLoad = e.target.files[0] // here call the base64 function which is returning the base64 string this.setState({ image: fileToLoad.base64, }, ()=> { console.log(this.state.image) }); // here I am getting the image key with base64 string on state. } render() { <div> <Button onClick={()=>this.postQuery()}>SUBMIT</Button> </div> <div> <FormControl id="formControlsFile" type="file" label="file" onChange={(e) => this.uploadImage(e)} style={{display: 'none'}} // if change to display block and click on the input then everything works correct. /> <label style={{ display: 'inline-block' }} htmlFor="formControlsFile"> <i className={cx( fontStyles.fa, fontStyles["fa-image"] )} /> <span>UPLOAD IMAGE</span> </label> </div> }

¿Puede alguien guiarme donde necesito arreglar/modificar? Cualquier sugerencia o ayuda es muy apreciada. Gracias de antemano por las interacciones.