可以通过编程方式使用 React 的新 Context API 吗？

Question

我正在尝试拥有 1 个我可以执行操作的大全局状态，但我不希望所有这些操作都存在于同一个文件中。

我想将操作分解到它们自己的文件中并使用 changeState 函数（如 reducer）进行抽象，但我不确定该怎么做。

我这里有一个例子。如果您单击该按钮，它会显示该应用程序已完成多远：https://codesandbox.io/s/r49qyymjzn

好像从来没打过{ctx => { console.log('...') }.

非常感谢任何帮助，谢谢。

Answer 1

将 Context.Provider 视为有状态组件。操作 changeName 需要更新 Context.Provider class.

的状态

context.js

的变化

handleNameChange = changeName;


actions: {
  changeName: this.handleNameChange
}

changeName.js

export default (e, newName) => {
  e.preventDefault();
  this.setState({ name: newName });
};

工作沙箱示例here

Possible to use React's new Context API programmatically?