返回列表 发帖

#侦听器调试

onTrack 和 onTrigger 选项可用于调试侦听器的行为。

onTrack 将在响应式 property 或 ref 作为依赖项被追踪时被调用。
onTrigger 将在依赖项变更导致副作用被触发时被调用。
这两个回调都将接收到一个包含有关所依赖项信息的调试器事件。建议在以下回调中编写 debugger 语句来检查依赖关系:

watchEffect(
  () => {
    /* 副作用 */
  },
  {
    onTrigger(e) {
      debugger
    }
  }
)
onTrack 和 onTrigger 只能在开发模式下工作。

#watch
watch API 完全等同于组件侦听器 property。watch 需要侦听特定的数据源,并在回调函数中执行副作用。默认情况下,它也是惰性的,即只有当被侦听的源发生变化时才执行回调。

与 watchEffect 比较,watch 允许我们:
懒执行副作用;
更具体地说明什么状态应该触发侦听器重新运行;
访问侦听状态变化前后的值。
#侦听单个数据源
侦听器数据源可以是返回值的 getter 函数,也可以直接是 ref:

// 侦听一个 getter
const state = reactive({ count: 0 })
watch(
  () => state.count,
  (count, prevCount) => {
    /* ... */
  }
)
// 直接侦听ref
const count = ref(0)
watch(count, (count, prevCount) => {
  /* ... */

返回列表