如何从所有组件的componentDidMount调用函数

Question

我正在建立一个基于ReactJS的网站。我正在使用钩子，如果它有所作为。

我正在为防伪令牌等编写一些安全代码。我想自动调用一个函数，而无需一页一页地实现它。

如何从所有组件的componentDidMount调用函数？有全球活动吗？

现在像这样做；但是要全力以赴并实施它真的很复杂...

HashMap

Answer 1

如果使用的是Hook，则说明您使用的是功能组件，因此无法访问诸如componentDidMount之类的生命周期方法。要触发安装和卸载效果，您必须执行

之类的操作

React.useEffect(() => token.Get(), [])

（https://reactjs.org/docs/hooks-effect.html#tip-optimizing-performance-by-skipping-effects）

要定义您想要的全局行为，您可以在根App.js级别上实现该行为。您也可以创建一个更高阶的组件来包装需要此行为的每个组件，但是对于一行代码（https://reactjs.org/docs/higher-order-components.html）来说似乎有些过分了

Answer 2

如果您想自动向所有请求中添加令牌，可以使用axios这样轻松地做到这一点：

axios.defaults.headers.common['Authorization'] = YOUR_TOKEN;

有关详细信息，请参见axios documentation。