Soy nuevo para reaccionar y estoy tratando de ejecutar funciones una tras otra.
Este es mi código:
submit = () => { this.props.toggle(); this.props.getValue(); this.notify(); this.props.resetValidation(); this.props.disable(); this.props.actionCost(); };Aquí getValue es una función asíncrona y notificar es una función de reacción al tostador, el resto es una función síncrona. Primero quiero ejecutar getValue y luego ejecutar todas las demás funciones después de que se haya ejecutado. Cómo puedo hacer eso. Actualmente todas las funciones se ejecutan simultáneamente
Por favor ayuda
submit = async () => { this.props.toggle(); await this.props.getValue(); this.notify(); this.props.resetValidation(); this.props.disable(); this.props.actionCost(); };Dado que getValue es una función async , devuelve un objeto Promise y desea que se ejecuten otras funciones después de que getValue haya completado su ejecución, puede usar .then() o await en getValue .
Usando .then() .
submit = () => { this.props.getValue().then(res=>{ this.props.toggle(); //All these functions execute only after getValue has completed it's execution. this.notify(); this.props.resetValidation(); this.props.disable(); this.props.actionCost(); }) };usando esperar
submit = async() => { await this.props.getValue(); //Note that this should be placed on top as this is the function you want to run first, and other functions to execute only after this has completed. this.props.toggle(); this.notify(); this.props.resetValidation(); this.props.disable(); this.props.actionCost(); }; Dado que su función getValues usa una función axios, debe devolver la promesa después de que axios haya completado su operación. Su getValues debería ser algo como esto: Hacer que getValues sea una función async
const getValues = async() =>{ let res = await axios.get('URL') //Just an instance, change the axios method(GET,POST,PUT) according to your needs. return res } (O) Devolver una promesa de getValues .
const getValues = () =>{ return new Promise((resolve,reject)=>{ axios.get('URL',response=>{ resolve("AXIOS REQUEST COMPLETE") } }) } Puede actualizar su getValues a cualquiera de las formas descritas anteriormente y llamar a getValues como se muestra anteriormente y funcionará como se esperaba.
Debe definir el método de envío como un método asíncrono y será así:
submit = async () => { this.props.toggle(); await this.props.getValue(); this.notify(); this.props.resetValidation(); this.props.disable(); this.props.actionCost(); };