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

Question

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

我想将操作分解为自己的文件并使用changeState函数（如缩减器）进行抽象，但我不确定如何执行此操作。

我在这里有一个例子。如果您点击该按钮，它会显示应用程序获取的距离：https://codesandbox.io/s/r49qyymjzn

似乎永远不会碰到{ctx => { console.log('...') }。

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

Answer 1

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

context.js

的变化

handleNameChange = changeName;


actions: {
  changeName: this.handleNameChange
}

changeName.js

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

工作沙箱示例here