Question

我正在尝试创建多个不同的Redux存储，因为那是在'react-redux'中使用createProvider（）方法。

我已经安装了最新版本的react-redux版本（7.1.0），但出现类似“未从react-redux导出createProvider”之类的错误。当我浏览节点模块时，无法在react-redux的src内找到createProvider。是版本问题还是我在代码中错过了某些内容。我与您分享了以下代码段：

Provider.js

    import { createProvider } from "react-redux";

export const STORE_KEY = "myComponentStore";

export const Provider = createProvider(STORE_KEY);

TestComponent.js

    import React, { Component } from "react";
    import { createStore } from "redux";
    import Mycomponent from "./MyComponent";

    import { Provider } from "./Provider";

    const reducer = {};

    const initialState = {
title: "multiple store"
};

    const store = createStore(reducer, initialState);

    class TestComponent extends Component {
      render() {
        return (
          <Provider store={store}>
            <Mycomponent />
          </Provider>
        );
      }
    }
    export default TestComponent;

Mycomponent.js

import React, { Component } from "react";

import { connect } from "./Connect";

class MyComponent extends Component {
  render() {
    return <div>{this.props.title}</div>;
  }
}

export default connect(function mapStateToProps(state) {
  return {
    title: state.title
  };
})(MyComponent);

Answer 1

自V6以来似乎是deprecated和removed

Answer 2

在documentation中，

在一个应用程序中不要创建多个商店！相反，使用 CombineReducers可以从多个中创建一个根减速器。

因此，一个提供程序，一个商店和多个reducer是使用redux的正确（推荐）方法。为您的应用程序创建一个全局提供程序，并为该提供程序定义化简。您可以为组件使用数据选择器。

对于这些信息，开发人员可能决定弃用createProvider功能。

Answer 3

我正在尝试创建多个不同的Redux商店

在单个React应用程序中具有多个不同的Redux存储是很好的。只是不要使用.mod。具有多个独立Redux存储的两种方法是：

使用Redux sub-apps:

createProvider()

通过这种方法，多个Redux存储将共存。

在单个React应用程序中使用多个SPA-请参阅crisp-react。使用这种方法，多个Redux存储将不共存。
构建简明反应时，它将创建具有2个SPA的React应用程序，并且可以将Redux添加到每个SPA。然后，您可以从一个SPA（及其Redux商店）切换到另一个SPA及其商店。

Answer 4

您的商店可能是这样的：

<div class="wrapper">
  <p class="border--short text--bigtitle">Short Border</p>
</div>

“ rootReducer”是不同的reducer文件的组合：

// store.js

import { createStore } from 'redux';
import rootReducer from './root-reducer';

export default createStore(rootReducer);

然后您的商店在//root-reducer.js import SomeReducers from './reducers/some-reducers'; import AnotherOne from './reducers/another-one'; const rootReducer = combineReducers({ SomeReducers, AnotherOne, }) export default rootReducer;

中使用

index

但是它仍然只是一个// index.js import React from 'react'; import ReactDOM from 'react-dom'; import { Provider } from "react-redux"; import store from "./storage/store"; import App from './App'; ReactDOM.render( <Provider store={store}> <App /> </Provider> , document.getElementById('root') );

createProvider不是从react-redux导出的吗？

4 个答案: