ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

全局异常(QuasarV2 Vue3 Quasar-cli)

2022-04-29 20:03:38  阅读:269  来源: 互联网

标签:quasar cli Quasar QuasarV2 boot errorHandler error 异常


全局异常(QuasarV2 Vue3 Quasar-cli)

目录

对于传统vue的处理

在main.js文件进行处理即可

import Vue from 'vue'
//系统错误捕获
const errorHandler = (error, vm)=>{
  console.error('抛出全局异常');
  console.error(vm);
  console.error(error);
  
}

Vue.config.errorHandler = errorHandler;
Vue.prototype.$throw = (error)=> errorHandler(error,this);

对于Quasar-cli的完整记录( 全局异常捕获)

首先 vue2的quasar v1.x 和 vue3的quasar 2.x 是不一样的,我这里记录的是quasar2的!!
具体就是启动文件属性,少了vue这个属性,导致写法上有些不同

1.配置启动文件

quasar这里没有main.js文件。但是官网对此进行了说明

https://quasar.dev/quasar-cli-webpack/boot-files

也就是针对你需要的功能,单独设立启动文件

我这里就手动增加一个ErrorHandler的全局异常捕捉的启动文件

$ quasar new boot ErrorHandle

此时quasar就会帮我们生成这个文件src\boot\ErrorHandler.js。
生成好了还不行,还需要再quasar.config.js中进行引用

2.写异常捕获启动文件的逻辑

src\boot\ErrorHandler.js

import { boot } from "quasar/wrappers";
import { errorHandler } from "src/utils/errorHandler";
 
export default boot(async ({ app }) => {
  // something to do
  console.log(
    "hehx 自定义quasar 启动文件 参考 http://www.quasarchs.com/quasar-cli/boot-files"
  ); 
  app.config.errorHandler = errorHandler; 
});

这里我在src/utils/errorHandler定义了捕获的逻辑(名字一样不要介意,本人不太专业)

//  src\utils\ErrorHandler.js
import { Dialog } from "quasar";
export function errorHandler(err, vm, info) {
  Dialog.create({ title: "抱歉,发生了异常", message: err.message })
    .onOk(() => {
      window.location.replace("https//localhost");
    })
    .onCancel(() => {
      window.location.replace("https//localhost");
    })
    .onDismiss(() => {
      window.location.replace("https//localhost");
    });
  // console.error(err.message);
  // history.go(-1);
  // debugger;
}

3.然后手动抛出异常试试

// 在vue文件内
 getEncryptIdCard() {
      throw new Error("手动外部异常");
      return idCardNumberEncrypt(this.userIdCardNo);
    },

标签:quasar,cli,Quasar,QuasarV2,boot,errorHandler,error,异常
来源: https://www.cnblogs.com/hehaoxiang/p/16208039.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有