Question

我有一个包含许多功能的类，我希望将这些功能外包，并将每组功能放入各自的文件中，然后通过导入和调用它们来使用它们。
通常这很简单，您只需将函数体放在另一个文件中，然后将它们导出，但是在我的情况下，我使用this.state和this.setState，是否仍然可以将这些函数外包？如果没有，有更好的做法吗？
谢谢。

Answer 1

我只是在没有任何测试的情况下很快就把它敲了出来，请告诉我这是否是您想要的？

window._stateManager = new StateManager();

class X extends React.Component {
    constructor(props) {
        super(props);

        _stateManager.addStateFunction(this.setState.bind(this));
    }
}


class StateManager() {
    constructor() {
        this.stateFunctions = [];
    }

    addStateFunction(ss) {
        this.stateFunctions.push(ss);
    }

    updateStates(obj) {
        this.stateFunctions.forEach(ss => {
            ss((state => {
                // here you have access to "this.state" as state
                return Object.assign({}, state, obj);
                // whatever you return from this function changes the state of the react component
            }))
        })
    }
}

Answer 2

为什么要通过不属于您的组件或子组件的功能更新状态。这没有道理。您想使用redux，那么整个应用程序的状态源将存储在商店中。您所有的状态更新逻辑都将在reducer中分离，并且您可以访问可更新应用程序状态的操作创建者。

我该如何外包使用state的函数并执行setState

2 个答案: