分析响应性 {🚀}
使用 trace 进行调试
trace 是一个小型实用程序，可帮助您找出计算值、反应或组件重新计算的原因。
只需导入 import { trace } from "mobx" 并将其放入反应或计算值中即可使用它。它将打印当前派生重新计算的原因。
可以选择通过将 true 作为最后一个参数传递来自动进入调试器。这样，导致反应重新运行的确切突变将仍然位于堆栈中，通常在堆栈向上约 8 个帧的位置。参见下面的图片。
在调试器模式下，调试信息还将显示影响当前计算/反应的完整派生树。
实时示例
这是一个部署后的示例，用于探索堆栈。确保使用 chrome 调试器的黑盒功能进行操作！
使用示例
调用 trace() 有不同的方法，以下是一些示例。
import { observer } from "mobx-react"
import { trace } from "mobx"
const MyComponent = observer(() => {
trace(true) // Enter the debugger whenever an observable value causes this component to re-run.
return <div>{this.props.user.name}</name>
})
使用反应的 reaction 参数启用跟踪 / 自动运行。
mobx.autorun("logger", reaction => {
reaction.trace()
console.log(user.fullname)
})
传入计算属性的属性名称。
trace(user, "fullname")
自省 API
如果您想在调试时检查 MobX 的内部状态，或者想在 MobX 之上构建酷炫的工具，以下 API 可能会有所帮助。还与各种 isObservable* API 相关。
getDebugName
用法
getDebugName(thing, property?)
返回可观察对象、属性、反应等的（生成的）友好调试名称。例如，由 MobX 开发者工具 使用。
getDependencyTree
用法
getDependencyTree(thing, property?).
返回一个树结构，其中包含给定反应/计算当前依赖的所有可观察对象。
getObserverTree
用法
getObserverTree(thing, property?).
返回一个树结构，其中包含观察给定可观察对象的所有反应/计算。
getAtom
用法
getAtom(thing, property?).
返回给定可观察对象、属性、反应等的底层原子。
Spy
用法
spy(listener)
注册一个全局间谍监听器，它监听 MobX 中发生的所有事件。它类似于将 observe 监听器附加到所有可观察对象，但还会通知正在运行的（传输/重新）操作和计算。例如，由 MobX 开发者工具 使用。
间谍所有操作的示例用法
spy(event => {
if (event.type === "action") {
console.log(`${event.name} with args: ${event.arguments}`)
}
})
间谍监听器始终接收一个对象，该对象通常至少包含一个 type 字段。默认情况下，spy 会发出以下事件。
| 类型 | observableKind | 其他字段 | 嵌套 |
|---|---|---|---|
| 操作 | name、object（作用域）、arguments[] | 是 | |
| scheduled-reaction | name | 否 | |
| 反应 | name | 是 | |
| 错误 | name、message、error | 否 | |
| add、update、remove、delete、splice | 查看 拦截与观察 {🚀} | 是 | |
| report-end | spyReportEnd=true、time?（总执行时间，以毫秒为单位） | 否 |
report-end 事件是先前已发出具有 spyReportStart: true 的事件的一部分。此事件表示事件结束，并以这种方式创建具有子事件的事件组。此事件还可能报告总执行时间。
可观察值的可 spy 事件与传递给 observe 的事件相同。在生产版本中，spy API 是一个无操作 API，因为它将被最小化掉。
查看 拦截与观察 {🚀} 部分，以获取详细的概述。