用了那么久的Vue，你了解Vue的报错机制吗？

Vue的5种处理Vue异常的方法

相信大家对Vue都不陌生。在使用Vue的时候也会遇到报错，也会使用浏览器的F12 来查看报错信息。但是你知道Vue是如何进行异常抛出的吗？vue 是如何处理异常的呢？接下来和大家介绍介绍，Vue是如何处理这几种常见的报错的。

先和大家说说常见的五种处理报错的方法

Vue 中异常处理包含以下几个方面：

• errorHandler
• warnHandler
• renderError
• errorCaptured
• window.onerror (不仅仅针对 Vue)

方法一：errorHandler

在main.js文件中添加，或者引入Vue

import Vue from 'vue'
Vue.config.errorHandler = function(err, vm, info) {
//do something
}; 

err指代 error 对象，info是一个 Vue 特有的字符串，vm指代 Vue 应用本身。记住在一个页面你可以有多个 Vue 应用。这个 error Handler 作用到所有的应用。

方法二：warnHandler

warnHandler用来捕获 Vue的warning。但是在生产环境是不起作用的。

import Vue from 'vue'
Vue.config.warnHandler = function(msg, vm, trace) {}; 

msg是报错信息和vm是报错的虚拟DOM，trace代表了组件树。

方法三: renderError

和前面两个不同，这个技巧不适用于全局，和组件相关。并且只适用于非生产环境

错误代码:

 <div>第二种错误 {
  { b }}</div> 

 computed: {b () {return x;}},