首页 > 其他分享 >react项目,或者vue项目。手动隐藏warning。保持控制台的清晰

react项目,或者vue项目。手动隐藏warning。保持控制台的清晰

时间:2023-06-01 14:56:18浏览次数:40  
标签:剩余 vue console args react warning arguments message

非常感谢您的指正和提醒,我的回答中使用了 arguments 对象,而这不是一个好的实践。可以使用 ES6 的剩余参数(rest parameters)来代替 arguments 对象。

以下是使用剩余参数替换 arguments 对象的示例代码:

import React from 'react';
import ReactDOM from 'react-dom';

const consoleError = console.error;

console.error = function (...args) {
  const message = args.join(' ');

  if (
    typeof message === 'string' &&
    message.startsWith('Warning: ') &&
    !message.includes('Warning: componentWillReceiveProps has been renamed')
  ) {
    return;
  }
  consoleError.apply(console, args);
};

ReactDOM.render(<App />, document.getElementById('root'));

在这里,我们使用剩余参数 ...args 来代替 arguments 对象,同时使用 join(' ') 方法来将剩余参数转换为一个字符串。然后我们检查警告信息是否以 Warning: 开头,并忽略指定的警告信息。控制台输出错误信息时,我们同样使用了 apply() 方法来将参数传递给 consoleError 方法。

需要注意的是,使用剩余参数可以使代码更加清晰易懂,同时也更符合现代 JavaScript 代码的编写风格。

标签:剩余,vue,console,args,react,warning,arguments,message
From: https://www.cnblogs.com/cn-oldboy/p/17448990.html

相关文章

  • Vue通用下拉树组件@riophae/vue-treeselect的使用
    vue-treeselect是一款下拉树通用组件。@riophae/vue-treeselect是一个基于Vue.js的树形选择器组件,可以用于选择树形结构的数据。它支持多选、搜索、异步加载等功能,可以自定义选项的样式和模板。该组件易于使用和扩展,适用于各种类型的项目。npm:https://www.npmjs.com/package/@......
  • vues全局使用WebSocket 多次吊起
    //import{showInfoMsg,showErrorMsg}from'@/utils/popInfo'//importElementUIfrom'element-ui';import{Toast}from'vant';functioninitWebSocket(that,baseObj){console.log(baseObj)console.log(this)co......
  • uniapp+vue3+ts 使用pinia报错
    "hasInjectionContext"isnotexportedby"node_modules/vue-demi/lib/index.mjs",importedby"node_modules/pinia/dist/pinia.mjs".11:36:19.397at../node_modules/pinia/dist/pinia.mjs:6:9 解决方法:把pinia降级 先删除pinianpmunipin......
  • vue3 ts elementplus行头加el-tooltip
    <!--vue3tselementplus行头加el-tooltip--><el-table-columnalign="left"><template#header><el-tooltipclass="box-item"effect="dark"con......
  • vue+element项目中统一处理接口异常,只提示一次异常信息
     有时候一个页面会同时调多个接口,但是多个接口异常,需要做提示,那么提示的时候会弹出很多的提示信息,这无疑让体验感降低很多。 所以针对这种情况,我们配合elementUI统一做一个异常状态的处理,只能显示一次提示的功能,后续代码调接口的时候也可以省略去写异常状态下的逻辑了。首先......
  • vue+docxtemplater,填充word模板
    安装依赖yarnadddocxtemplateryarnaddpizzipyarnaddjszip-utilsyarnaddfile-saver//模板解析插件(支持list循环直接使用$index,使用if判断语法)yarnaddangular-expressionsyarnaddlodash页面测试代码<template> <div> <button@click="bt......
  • vuex加入后启动项目出现WARNING
    出现问题:importVuexfrom‘vuex’;Vue.use(Vuex);安装导入vuex后,在终端执行npmrunserve后出现WARNING,网页中vue无法启动WARNINGCompiledwith3warnings10:33:05warningin../node_module......
  • vue开场动画2
    <!--加载中动画--><style>.app-loading-box{position:fixed;display:flex;justify-content:space-around;align-items:center;width:100vw;height:100vh;top:0;}......
  • vue出现样式问题,竖线样式为正常展示
    预期样式效果: 但是有时候是这样的: 有时候又是好的,奇奇怪怪得bug,经过查看debugger,发现是代码逻辑出现了问题。 本来finally里面得东西是放在请求外面的,请求时异步得,先执行了下面finally里面的逻辑,导致后执行得请求返回来的函数,接收不到变量的变化就gg了,刚开始这里用的还......
  • vue基础用法-初步使用vue
    1.基本使用步骤导入vue.js的script脚本文件在页面中声明一个将要被vue所控制的DOM区域创建vm实例对象(vue实例对象)<!DOCTYPEhtml><htmllange="en"> <head> <metacharset="utf-8"> <title></title> </head> <body> <!--希望......