Question

我在一个代码库中工作，该代码库中有一堆redux已经用于管理和持久化状态以及调度操作。我使用新的Context API的目标是摆脱我必须要做的事情，以便将所有这些状态部分提供给各种组件，但保留现有的用于在redux中管理状态的代码。

现在我已经删除了过多的道具钻孔代码，并将它们替换为上下文提供者和消费者，将它们连接到我所有正确位置的组件中。我仍在向redux发送操作并获取填充我的redux存储的API响应，并且我想以某种方式通知上下文在redux存储的特定部分更新时更新。

如何从递送到我的不同提供商的redux商店获取更新？

Answer 1

由于您正在使用新的Context Api，因此您可以轻松地connect使用带有redux存储的Context Provider的组件并更新上下文值，例如

const Context = React.createContext();
class App extends React.Component {
   state = {
       user: ''
   }
   static getDerivedStateFromProps(nextProps, prevState) {
       if(nextProps.user !== prevState.user) {
          return {user: nextProps.user}
       }
       return null;
   }
   render() {
       return <Context.Provider value={this.state.user}>
           <MyComponent />
       </Context.Provider>
   }
}
const mapStateToProps(state) {
   return {
      user: state.user
   }
}
export default connect(mapStateToProps)(App);

如何将React 16.3上下文提供程序与redux store一起使用？

1 个答案: