Cómo borrar el historial actual
Borrar manualmente el historial es posible, pero es un poco engorroso, es necesario escribir manualmente la acción y luego escucharla en cada restaurador.
Si quieres ser más general, puedes crear una acción
//Claves de estado
exportar función clearState(. .keys) {
return {
tipo: CLEAR_STATE,
claves: claves
}
}
importar React, {PropTypes.Component} de 'react';
importar {clearState} de 'acciones';
importar {conectar} desde 'react-redux';
const clearStateWithUnmount = (... .stateKeys) =gt; WrappedComponent =gt; ) {
return;
}
let instancia = clase extiende el componente {
componenteWillUnmount() {
this.props.dispatch(clearState(.stateKeys));
}
render() {
return lt;WrappedComponent {... .this .props} /gt;;
}
};
return connect(null)(instancia);
};
exportar ClearStateWithUnmount predeterminado;
4. Procesar el almacenamiento cuando se crea
//Introduzca todos los reductores aquí
const appReducer = combineReducers ( {
... .reductores
});
const rootReducer = (estado, acción) =gt; / Borrar el estado especificado
if(action.type === CLEAR_STATE) {
const {tipo, claves} = acción;
keys.forEach ( k =gt; {
_.set(state, k, undefinido);
//El método _.set es un método en lodog.
El método set es un método en lodash, donde el estado correspondiente se establece en indefinido
});
}
return appReducer(state, action);
};
//create store
const store = createStore(rootReducer);
5. Buen trabajo, por ejemplo, Hay un componente de usuario
//Aquí se usa el modo decorador, que requiere soporte de babel
@clearStateWithUnmount('user')
class El usuario extiende el componente {
...
}
// Si no quieres utilizar un decorador, puedes escribirlo de la forma habitual
clearStateWithUnmount(' usuario')(Usuario)
6. Cuando se descarga el componente Usuario, esto borrará el almacenamiento correspondiente
7. El estado tiene anidamiento profundo, como {usuario: {nombre:' foo', edad: 12}}, el mismo método también se admite aquí
@clearStateWithUnmount('user.name', 'user.age')
8. Si no quieres invadir el proyecto actual, puedes crear un middleware. El principio es el mismo.