reactjs - react - Cómo escuchar cambios específicos de propiedad en la tienda Redux después de que se envía una acción

reactjs redux

Question

Actualmente estoy tratando de conceptualizar cómo manejar el envío de una acción en un componente basado en un cambio de datos después de un envío en otro componente.

Toma este escenario:

dispatch(someAjax) -> propiedad en actualizaciones de estado.

Después de esto, necesito otro componente que dependa de esta misma propiedad para saber que se ha actualizado y enviar una acción basada en el nuevo valor.

En lugar de usar algún tipo de value.on(change... solución, ¿cuál es la forma preferida de manejar este tipo de acción ''en cascada''?

Answer 1

Hay dos enfoques básicos: un middleware que difiere el estado después de que se realiza una acción o el uso de la API store.subscribe bajo nivel de store.subscribe .

Las preguntas frecuentes de Redux tienen una respuesta que cubre esto . Además, mantengo una lista categorizada de complementos y utilidades relacionados con Redux, y eso incluye un grupo de bibliotecas de suscripción de cambio de tienda existentes que implementan varios enfoques para escuchar los cambios de datos.

Answer 2

Puede usar mapStateToProps de Redux y connect con el componentDidUpdate(prevProps, prevState, snapshot) de componentDidUpdate(prevProps, prevState, snapshot) React.

Entonces, básicamente, su código podría verse así:

const mapStateToProps = (state) => ({ 
   specificProperty: state.specificProperty,
   // any props you need else
});

class YourComponent extends React.Component {
    render() {
      // render your component  
    }

    componentDidUpdate(prevProps, prevState, snapshot) {
        if (prevProps.specificProperty !== this.props.specificProperty) {
            // Do whatever you want
        }
    }
}

YourComponent = connect(mapStateToProps)(YourComponent);