vue常见报错及解决方案,vue遇到的问题和解决方法
Yyds干货库存
Vue的五种处理Vue异常的方法相信大家都很熟悉。使用Vue时也会遇到错误，也会使用浏览器的F12查看错误信息。但是你知道Vue是怎么抛出异常的吗？vue如何处理异常？接下来，我们来介绍一下Vue是如何处理几种常见错误的。
先说常见错误，再告诉你如何处理。
Vue中的异常处理包括以下技巧：errorhandlerwarnhandlerhandlerrorcapturewindow。On Error(不仅针对Vue)方法1:在main.js文件中添加ErrorHandler，或者引入Vue。
从“vue”导入Vue
vue . config . error handler=function(err，vm，info) {
//做点什么
};Err是指错误对象，info是Vue特有的字符串，vm是指Vue应用本身。请记住，一个页面上可以有多个Vue应用。该错误处理程序适用于所有应用程序。
方法2:警告处理程序
WarnHandler用于捕获Vue的警告。但是在生产环境中却行不通。
从“vue”导入Vue
vue . config . warn handler=function(msg，vm，trace){ }；Msg是错误消息，vm是虚拟DOM，trace表示组件树。请看下面的例子：
方法三：renderError与前两种不同。这种技术不适用于全局情况，而是与组件相关。只适用于非生产环境。
错误代码：
div second error { { b } }/div computed:{
b () {
返回x；
}
}，示例：
renderError (h，err) {
return h(pre ，{ style: { color: black } }，err.stack)
}
方法4:当捕获到来自后代组件的错误时，调用errorCaptured。这个钩子接收三个参数：错误对象、发生错误的组件实例和包含错误来源信息的字符串。这个钩子可以返回false来防止错误向上传播。
app.config.errorHandler=(err，vm info)={
//做点什么
}Error是错误对象，vm是发生错误的组件实例的可访问组件属性，info是包含错误来源信息的字符串。
方法五：window.onerror特点：可以监控所有JavaScript错误，以及Vue组件报告的错误，包括一些异步错误。无法根据报告的错误识别Vue组件的详细信息，也无法监控已经被try/catch捕获的错误。无法监控资源加载失败的错误窗口。它是一个全局异常处理程序，可以捕获所有JavaScript异常。如果函数返回true，默认事件处理程序将被阻止执行。
window.onerror=function(消息，源，行，列，错误){
//做点什么
};Message是错误消息，source是有错误的资源，line是有错误的行号，column是有错误的列数，Error是错误对象。
在errorHandler的参数中，err是指错误对象，info是Vue特有的字符串，vm是指Vue应用本身。一个页面上可以有多个Vue应用程序。这个错误处理程序可以应用于所有应用程序。警告不会触发errorHandler。只有在抛出错误时才会触发。
第一种：引用一个不存在的变量：在Vue中，我们写代码时有时会出错，我们引用了模板中未定义的变量，导致了异常。该异常将仅报告[Vue warn],而不报告控制台中的ReferenceError。
Div第一个错误，{{ a }} /div
使用warnHandler获取错误vue . config . warn handler=function(msg，VM，trace) {
console . log(` Error:$ { msg } \ n Error object:$ { trace } `)；
}
第二种：将变量绑定到计算属性，计算时会抛出异常。
将一个变量绑定到一个计算属性，在计算过程中会抛出一个异常代码。控制台中会抛出一个[Vue warn]和一个一般错误，网页上会出现一个白屏。
div second error { { b } }/div computed:{
b () {
返回x；
}
},
使用errorHandler从“vue”vue . config中捕获错误import vue。error handler=function(err，VM，info) {
console . log(` error:$ { err . tostring()} \ n错误消息：$ { info } `)；
console.log(虚拟机)
};
使用warnHandler获取错误vue . config . warn handler=function(msg，VM，trace) {
console . log(` Error:$ { msg } \ n Error object:$ { trace } `)；
}第三种方法：执行一个会抛出异常的方法。该错误也在控制台中[Vue warn]并定期报告。与之前的错误不同的是，只有当你点击按钮时，才会触发函数调用并报错。
从 Vue Vue . config . error handler=function(err，vm，info)导入Vue {
console . log(` error:$ { err . tostring()} \ n错误消息：$ { info } `)；
console.log(虚拟机)
};
版权归作者所有：来自博主的苦糖？原创作品请联系作者授权转载，否则将追究法律责任。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。