是否可以在Redux中的提供商上下文之外更新商店

Question

我有一些配置设置，我想设置并保存到Redux Store之前，然后在主要应用程序加载之前。这样一来，所有孩子组件都已经预先加载了配置数据，并且可以使用redux-connect从商店读取它。

目前，我只知道如何在提供商上下文中包裹的连接组件内使用和更新商店。

有没有办法在此之外更新它？

例如：

class App extends React {
   constructor(props) {
      super(props);
      // UPDATE REDUX STORE HERE
   }
   componentDidUpdate() {
      // OR UPDATE REDUX STORE HERE
   }
   render() {
       return (
           <Provider store={store}>
              <Child />
           </Provider>
       );
   }
 }

这甚至可能吗？

Answer 1

store只是一个包含dispatch和getState功能的对象。这意味着无论商店在应用程序以外的何处都可以使用这些属性对其进行操作。

const store = configureStore();
const App = () => (<Provider store={store} />);
store.dispatch({ type: SOME_ACTION_TYPE });

Answer 2

您可以在 index.js

中拨打App组件外的提供商

ReactDOM.render(
    <Provider store={store}>
        <App/>
    </Provider>
    , document.getElementById('root'));

现在，在您的应用程序类中，可能会添加connect或updateAction

import {connect} from "react-redux";
import {updateStuf} from "./actions/projectActions";

class App extends Component {
    componentWillMount() {
        this.props.updateStuf();
    }
    render() {
        const {stuff} = this.props;
        return (
                <div className="stuff">
                </div>
        );
    }
}
const mapStateToProps = (state) => {
    return {
        stuff: state.project.stuff
    }
}
export default connect(mapStateToProps, {updateStuf})(App);