errorCaptured

errorCaptured 是组件级别的错误处理钩子。

基本用法

export default {
  data() {
    return { error: null }
  },
  errorCaptured(err, instance, info) {
    this.error = err
    return false // 阻止错误继续传播
  }
}

参数：

• err: 错误对象
• instance: 抛出错误的组件实例
• info: 错误来源信息

Composition API

import { onErrorCaptured } from 'vue'

export default {
  setup() {
    onErrorCaptured((err, instance, info) => {
      console.error('捕获到错误:', err)
      return false
    })
  }
}

错误边界

<template>
  <div v-if="error">
    <h2>出错了</h2>
    <p>{{ error.message }}</p>
  </div>
  <slot v-else></slot>
</template>

<script>
export default {
  data() {
    return { error: null }
  },
  errorCaptured(err) {
    this.error = err
    return false
  }
}
</script>

返回 false 阻止错误继续向上传播。

要点总结

• errorCaptured 捕获子孙组件错误
• 参数包含错误对象、组件实例和来源信息
• 返回 false 阻止错误传播
• 用于实现组件级错误边界