记录一次前端调试console.log的bug

最新推荐文章于 2023-11-25 09:39:03 发布
最新推荐文章于 2023-11-25 09:39:03 发布
阅读量923 收藏
点赞数
分类专栏： 技巧 经验 vue 文章标签： 前端 vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44804963/article/details/122928262
版权
技巧 同时被 3 个专栏收录
5 篇文章 0 订阅
订阅专栏
经验
1 篇文章 0 订阅
订阅专栏
vue
1 篇文章 0 订阅
订阅专栏

背景：在测试一个vue项目时，想着用console.log打印一下接口返回值，结果在Chrom浏览器F12控制台中并没有显示，一开始还以为是方法写错位置等代码问题，直到我在控制台直接输入console.log(1)都不会打印时才意识到是浏览器的问题，更换其他(Firefox、QQ、Opera等)浏览器输出时没有问题

解决方案：

  • 方案一：.网上说的最多的重置浏览器设置

    在这里插入图片描述在这里插入图片描述
    但是我重置后并没有解决

  • 方案二：检查控制台是否有设置过滤，如果有，请清除后再试

在这里插入图片描述

  • 方案三：以上两种方式我都试过(均无效)，最后发现是由于浏览器插件引起的（重点怀疑迅雷插件）

在这里插入图片描述
我将原先的迅雷插件移除后再试就可以了，所以大家也可以试试此方法
在这里插入图片描述
最后终于正常了

Panda_陽
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
同步还是异步？console.log的怪异现象解析
小敏哥的专栏
01-18 771
在开始正式装逼之前，我们先来看几句简单的代码，并试图预测它的输出结果 var a=[{index:1},{index:1}]; console.log('==============修改前==========='); console.log(a); for(var i=0;i<a.length;i++){ a[i].index=2; ...
VUE 修复MOCKJS ResponseType BUG
03-22
console.log(response.data); }); ``` 3. **统一处理**：如果你的应用需要处理多种类型的响应，可以在全局配置或拦截器中统一处理`responseType`。例如，对于`axios`，可以在创建实例时或添加一个响应拦截器： ...
console 篇 - console.log 的 “bug“ ?
09-25 495
一般来说，我们会使用 console.log() 来打印某个对象，并且，两次打印之间，还会对这个对象进行修改，最后我们查看打印的结果发现，修改前的打印和修改后的打印，竟然是一样的？这样出乎意料的情况，让我们难以继续 console.log 的调试。 口说无凭，举个例子把： 我们可以看到，一共有两次打印，一次是打印原始信息，一次是打印我们修改后的信息，并且我们把属性 a 从 0 改成 1 ，nam...
chrome console.log bug
zycbob
10-17 135
http://code.google.com/p/chromium/issues/detail?id=50316 What steps will reproduce the problem? Execute: var arr = [0, 1, 2]; for (var i=0; i
前端代码IE 8 console.log报错(bug)
curryFMVP的博客
02-04 377
前端代码IE 8浏览器 console.log报错(bug) IE8会将console.log()默认处理为错误逻辑，但是在F12下处理为控制台输出。 console.log() 养成好的编程习惯，不要滥用console.log()，调试后记得注释掉或删掉调试代码！！！ console.log() 养成好的编程习惯，不要滥用console.log()，调试后记得注释掉或删掉调试代码！！！ console.log() 养成好的编程习惯，不要滥用console.log()，调试后记得注释掉或删掉调试代码！！！
chrome控制台console.log无法时实打印引用类型值的bug
龙旗飘扬的舰队
01-31 1063
在js脚本中，使用console.log打印一个大型的对象（像 vm （vue实例），或者 window 对象），然后再设置延迟改变该对象的的某个属性（假设属性名为 ppp ）的值，会发现个有趣的现象： 如果是 window，假设执行如下脚本 会在控制台打印出如下输出： 首先，马上点击展开第一个输出值，10s后点击展开第二个输出值，会发现两个值分别为 第一个 第二个 从...
前端项目-javascript-debug.zip
09-03
"javascript-debug-master"可能包含了一个封装好的调试工具库，可能提供了更丰富的console.log替代方法，比如带有颜色、时间戳或自定义标签的输出，以及更方便的错误捕获和处理机制。这样的库可以帮助开发者快速定位...
Javascript调试方法 var_dump函数代码.zip
11-16
JavaScript是Web开发中不可或缺的一部分，尤其在前端交互和动态效果实现上起着核心作用。然而，编程过程中难免会遇到错误和异常，这时就需要有效的调试工具和技术来定位问题。本资源"Javascript调试方法 var_dump...
必备的JS调试技巧汇总
10-21
在前端开发中，调试JavaScript代码是一项基础而又至关重要的技能。随着前端技术的发展，如何快速定位问题、降低故障概率、分析逻辑错误变得越来越重要。...掌握前端调试技巧对于每一个前端开发者来说都是非常必要的。
在Chrome DevTools中调试JavaScript的实现
11-20
在Chrome DevTools中调试JavaScript是一项重要的技能，尤其对于前端开发者来说。本文将详细介绍如何利用Chrome DevTools的Sources面板来高效地查找和修复JavaScript代码中的错误。 首先，我们以一个简单的示例来...
【vue_1】console.log没有反应
最新发布
11-25 2294
上面这段代码的console.log一直打印不出来，发现可能是ElMessage的问题，ElMessage是已经封装好的函数。1、首先，将ElMessage删除，之后看控制台是否能够打印。很好，说明就是ElMessage的问题，在看一下报错的地方。插播一句：如何使用if-else 语句来处理逻辑？总结：多思考，多使用console.log。加上上面这句话就能正确运行了。要做一个权限不够的弹出消息框。哦，原来是忘记导入库了。
笔记：谷歌chrome浏览器console.log()无效
sky8880的博客
01-17 2508
修改前： 1.第一种情况 就是你关闭了谷歌info设置 ????： 勾选info+warning+error 2.第二种情况（前提是第一种情况没问题）????： 注意：有时候显示的是Filter和默认是一样的显示，会误导你！！！很坑这里 ...
【问题记录】vscode调试vue，console.log在vscode终端窗口无输出问题，从尝试到放弃
danqiu的博客
10-29 6538
vscode调试vue，console.log在vscode终端窗口无输出问题，从尝试到放弃
console.log打印出来的内容不一定正确
weixin_43764914的博客
07-26 725
在某些条件下，某些浏览器的console.log() 并不会把传入的内容立即输出。出现这种情况的主要原因是，在许多程序（不只是JavaScript）中，I/O 是非常低速的阻塞部分。所以，（从页面/UI 的角度来说）浏览器在后台异步处理控制台I/O 能够提高性能，这时用户甚至可能根本意识不到其发生。 var Num = { num: 1 }; // 紧接着 console.log( Num ); // 然后 Num.num++; 大部分情况下代码在开发者工具的控制台中输出的对象表示与期望是一致的
console.log无法打印问题
热门推荐
weixin_45773788的博客
06-26 1万+
本人遇到情况：vue项目中watch监听器监听绑定事件，console.log在控制台无显示，尝试alert正常。可能原因一：浏览器过滤条件问题（网上最常见的原因但本人并不是） 解决方案：左侧top栏选择info，默认级别（Default levels）中信息选项（info选项）要勾选，筛选器中清空。可能原因二（本人遇到的原因查了很久）：浏览器扩展程序问题。解决方案：亲测删除多余扩展后（云文档等）功能恢复正常，在另一浏览器上也是如此，都是存在云文档这一扩展程序导致console.log打印失效。...
HTML控制台信息出现在页面里,我的console.log不能在我的HTML页面中工作
weixin_39716105的博客
06-03 497
我对JavaScript很陌生，但我无法前进学习，因为我的console.log不起作用在所有我会输入console.log消息和在我的html页面上没有任何显示。我试图调试它，但我是如此新，我不知道我所能做的就是去论坛，问，似乎有些人有问题，但没有好的答案。我已经尝试了每一件我知道该怎么做(这不是很多)，但没有任何作品请帮助！我的console.log不能在我的HTML页面中工作这是我的计划My...
Chrome使用console.log打印无效【已解决】
weixin_47316183的博客
01-21 3700
试试可能会给你惊喜呢
html js代码怎么调试工具,js调试工具console.log()方法查看js代码的执行情况
weixin_32869687的博客
06-05 246
我之前在调试代码的时候,跟砸js代码执行情况,一般都是通过在代码块中使用alert的方式查看js代码的执行情况,今天也是看到有朋友使用console.log函数打印输出函数,变量,对象,下边就console.log的使用情况进行记录,具体的语法是:console.log("值为:",fn);console.log()能够输出变量,函数,数组,对象等等this关键字_函数调用var testobj ...
JavaScript调试技巧之console.log()详解--2015-08-07
weixin_30325793的博客
08-07 91
对于JavaScript程序的调试，相比于alert()，使用console.log()是一种更好的方式，原因在于：alert()函数会阻断 JavaScript程序的执行，从而造成副作用；而console.log()仅在控制台中打印相关信息，因此不会造成类似的顾虑 一、什么是console.log()？除了一些很老版本的浏览器，现今大多数浏览器都自带调试功能； 即使没有调试功能，也可以通过安...
前端打包忽略 console.log
08-10
前端打包忽略console.log的操作可以通过配置webpack来实现。根据提供的代码段，可以看到在webpack的配置中使用了UglifyJsPlugin插件来实现去除console.log的功能。在configureWebpack中的plugins数组中，添加了UglifyJsPlugin，并设置了compress的参数来去除console.log语句。具体的配置如下： ```javascript configureWebpack: config => { if (process.env.NODE_ENV === 'production') { return { plugins: [ new UglifyJsPlugin({ uglifyOptions: { compress: { warnings: false, drop_console: true, //移除console.log drop_debugger: true, //移除debugger pure_funcs: ['console.log'], //移除console.log }, }, }), ], } } } ``` 其中，drop_console参数设置为true表示移除console.log语句，pure_funcs参数设置为['console.log']表示移除console.log函数的调用。这样配置之后，在打包环境下，console.log语句会被自动忽略。123 #### 引用[.reference_title] - *1* *2* *3* [vue项目webpack打包时候去掉console.log等配置](https://blog.csdn.net/sinat_32017511/article/details/115764005)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值