Necesito que este código se implemente en el componente de clase. Es para usar un progreso de carga en mi componente de clase con react-toastify
function Example(){ const toastId = React.useRef(null); function handleUpload(){ axios.request({ method: "post", url: "/foobar", data: myData, onUploadProgress: p => { const progress = p.loaded / p.total; if(toastId.current === null){ toastId = toast('Upload in Progress', { progress: progress }); } else { toast.update(toastId.current, { progress: progress }) } } }).then(data => { toast.done(toastId.current); }) } return ( <div> <button onClick={handleUpload}>Upload something</button> </div> ) }¿Cómo puedo hacer eso?
useRef() se encuentra entre los ganchos de reacción y los ganchos están destinados a usarse en componentes funcionales, pero si desea crear una referencia en un componente basado en clases,
puede hacerlo desde el constructor de clases como los códigos a continuación:
constructor(props) { super(props); this.myRef = React.createRef(); }Compruebe React.createRef() .
Asigne su valor en el constructor, es decir, vincule con this .
createRef !== useRef , useRef se usa para conservar el valor en las nuevas representaciones y para eso en el componente de clase necesita vincularlo con this no createRef