4

我正在创建一个组件（-子），例如npm package（-另一个项目）。该组件将在另一个组件（-父级）中使用（将像 一样安装npm i child）。

所以，我的问题是我想在孩子中使用 redux 存储架构。在 parent 中，有一个太 redux 的 store 架构。在一个孩子，我不想使用自己的商店我想使用父组件的商店。我怎样才能做到这一点？如何在我的孩子中使用父组件的存储？

有可能的？我不知道该怎么做。

感谢您的任何帮助。

4

2 回答 2

1

我可以建议您两个选择：
1）为您的子组件制作一个减速器并将其传递给combineReducer您的减速器配置。然后您将可以访问全球商店。
2）或者您可以简单地将您的孩子从父组件中消耗的任何东西作为道具传递。

于 2018-10-29T10:42:29.293 回答
1

我认为还有更多的一种方法可以做到这一点。

我更喜欢使用联合减速器的方式。

在您的子应用程序中创建一些减速器：

import {ACTIONS} from './actions';

const defaultState = {
    counter: 0,
};

export default function(state = defaultState, action) {
    switch (action.type) {
        case ACTIONS.PLUS:
            let newState = {...state};
            newState.counter++;
            return newState;
        case ACTIONS.MINUS:
            let newState2 = {...state};
            newState2.counter--;
            return newState2;
        default:
            return state;
    }
};

从项目中导出这个减速器： export {default as YourReducer} from './your-reducer'；

现在，在父根减速器中结合这个减速器：

import {combineReducers} from 'redux'

import app from 'app/containers/app/app-reducer'
import {YourReducer} from '@this-is-your-package/YourReducer'

export default combineReducers({
    app,
    YourReducer,
})

所以，这一切，现在您可以在您的孩子身上使用connect, mapStateToProps, dispatchToProps, 等。

您也可以阅读父状态存储..

父商店如下所示：

app: { ... }         // <-- parent
YourReducer: { ... } // <-- your child
于 2018-10-29T11:22:38.830 回答