我可以在React应用程序中使某个函数全局可用吗

Question

以道具的形式从根组件a传递到子组件B是一种常见的做法，该函数将改变a的状态

class App extends React.Component {
constructor(props) {
super(props);
this.state = {
name: 'foo'
};
this.handleNameChange = this.handleNameChange.bind(this);
}
render() {
return (<NameChanger name={this.state.name} onNameChange={this.handleNameChange} />)
}
handleNameChange: function(newName) {
this.setState({
name: newName
});
}
}

现在，正如你所看到的，NameChanger只下降了一级，所以这不是一个大问题。但如果它已经下降了3级甚至4级呢？我们必须把它传给组件链，这让我很困扰。有没有办法让应用程序中的功能在全球范围内可用？

我看了Context(https://reactjs.org/docs/context.html)但我不确定它是否是全球可用功能的正确设计选择。还是这样？

感谢

Answer 1

在典型的React应用程序中，数据从上到下传递(父级到儿童(，但对于某些类型的许多人都需要的道具(例如区域设置偏好、UI主题(应用程序中的组件。上下文提供了一种共享方式像这样的值在组件之间无需显式传递穿过树的每一层的道具。

https://reactjs.org/docs/context.html

Answer 2

尝试使用Redux或Mobx(非常容易上手(作为状态管理库来解决这个问题。