Question

如果我使用tensorflow session进行了一些状态设置，例如：

useState

并且我想在中间件上进行某种日志记录，例如，记录每次对const [s, setS] = React.useState();的调用时的日志记录，我可以做些棘手的事情，例如：

setS

但是，这在很多状态项上显得有些笨拙。是否可以通过避免重复的方式来执行此操作，例如在const [s, setS_] = React.useState(); const setS = x => { console.log('setS called with: '); console.log(x); setS(x); }上建立一些钩子？

如果您想知道为什么我要这样做，那么我有一些useState花费了很长时间，我想尝试并开始调试它们；有点困难，因为我无法知道哪些动作花费了这么长时间。

Answer 1

您可以创建useEffect，当s更改时触发。不确定这是否满足您的所有要求，因为如果setS通过了s的当前状态（即，调用了s = 3和setS(3) ）

useEffect(() => {
  console.log('s changed to: ', s)
}, [s])

Answer 2

您可以包装原始的React.useState函数以启用日志记录，但是主要挑战是弄清楚谁在呼叫以及处于哪种状态，因为没有信息传递给{{ 1}}，但可选的初始值除外。

如何识别组件/状态

一个想法是使用Function.caller来识别谁在呼叫，但是在严格模式下不起作用（并且取决于您如何设置构建过程，它可能会自动启用）。

另一种方法是引发并捕获错误并查看其堆栈跟踪：

useState()

每当调用某个状态的updater函数时，您都会在控制台中获得一个堆栈跟踪，此外还有调用者列表与您的代码交叉引用的额外好处，因此您可以单击以查看调用了什么功能。

确定正在调用哪些钩子

2 个答案:

如何识别组件/状态