Vue前端开发之控制台打印数组异常情况

最新推荐文章于 2024-06-07 14:37:59 发布
最新推荐文章于 2024-06-07 14:37:59 发布
阅读量994 收藏
点赞数
文章标签： vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yunhuanjun/article/details/119863291
版权

控制台打印数组时显示有数据，但是展开之后没有数据，如图
在这里插入图描述
这是因为打印数组之后，后续代码又对数组进行了操作
打印的数组是操作前的数组
展开后会从内存读取操作后的数组

yunhuanjun
关注
前端网页技术之 Vue
cgblpx的博客
08-02 5万+
文章目录VueVue概念同类产品官网特点渐进式框架入门案例.html改造入门案例.htmlMVVM框架基础语法运算符 operator方法 methodsVue解析数据三种data值的写法高级用法：v-命令指令集双向绑定 v-model闪现 v-cloak判断 v-if循环 v-for事件 v-on绑定 v-bind小结Vue组件概述使用测试Vue路由概述使用步骤入门案例Vue的AjaxAjax概述Ajax原理axios测试常见错误Vue的生命周期lifecycle概述测试扩展：观察者设计模式HBuilde
vue控制台打印的数据与使用时不同的问题
CRCFeng的专栏
06-02 2753
今天在做vue项目的时候碰到一个问题，在这里记录一下 需求是通过日期筛选出符合条件的数据（发送请求把startDate和endDate传给后端），我这里用了el-date-picker 在@change时直接去调用接口请求数据，代码如下： <el-date-picker @change="getData" v-model="date" range-separator="~"
数组里面有值,但是console.log出来后打开却是空
old_hu的备忘录
05-10 7814
像遇到这种情况,很可能是深浅拷贝的问题,只要此时将赋值变为深拷贝,可能会解决问题 newObj = deep(obj) deep(obj) { let objName1 = JSON.stringify(obj), objName2 = JSON.parse(objName1; return objName2 } ...
记vue3+打印
choose_Mings的博客
07-05 377
记 vue3+打印(vue3-print-nb)
vue3的props属性打印不出来
poguanba的博客
09-28 1046
在vue3中，我们经常会使用defineProps用给父组件传值给子组件，但是我们会发现props里接收父组件传过来的值，在子组件打印不出来，但是在template又可以显示出来，这样会导致传过来的值在子组件里面无法使用。如：传过来的值是flag。
vue在控制台展开有值代码却获取不到
hoopec的博客
05-07 4024
目录1.浏览器控制台获取到的是当前值2.vue this指向发生改变异步请求 我们在平时经常遇到在测试的过程中在浏览器控制台展开数据有值但是代码却无法获取到值，我总结了自己遇到的一些情况，后面再发现可能继续更新。 1.浏览器控制台获取到的是当前值 当我们在console.log输出测试点开查看是否有值时，发现明明有值，代码使用时却获取不到，这是因为浏览器获取的是该参数当前的值，而不是你console.log输出时的值。 可以发现当我们在对展开之前又给它push一个值后，展开的是最新的数据而不是调用它时的数
vue3.0 + vite + typescript (遇到的问题)
阿臻
02-19 716
遇到的问题 1. 找不到模块“./App.vue”或其相应的类型声明。 解决方法: 开启托管模式 安装插件(插件说明提示:此插件已经被托管模式代替了) 官网内容摘要: 为了让 Vue 单文件组件和 TypeScript 一起工作，Volar 创建了一个针对 Vue 的 TS 语言服务实例，将其用于 Vue 单文件组件。同时，普通的 TS 文件依然由 VSCode 内置的 TS 语言服务来处理。 ...
Vue开发之watch监听数组、对象、变量操作分析
10-17
Vue.js是当前非常流行的前端JavaScript框架，它允许开发者构建响应式的数据驱动的Web界面。Vue的核心库只关注视图层，易于上手，同时与现代化的工具链以及各种支持库相结合，能够胜任复杂的单页应用(SPA)。在Vue.js...
vue 打印功能
guairena的博客
03-29 2146
需求： 请求到后端数据，渲染成表格，通过打印机打印出来 代码实现： list.vue <template> <div> <div class="printBox"> <div> <el-button type="primary" @click="printBtn" size="small">打印</el-button> </div> <div ref=
在vue中使用的打印插件
11-16
Vue.js 是一个流行的前端JavaScript框架，用于构建用户界面。在Vue项目中，有时我们需要实现打印功能，例如批量打印和分页打印。为了实现这些需求，我们可以利用特定的打印插件。本文将详细介绍如何在Vue中集成和...
【前端框架开发 | Vue.js | 第一篇】Vue.js框架简介、安装及打包教程
热门推荐
等风来
08-31 2万+
正式开始学习前 确保你已学过前端三件套 HTML CSS JavaScriptVue.js是一种流行的JavaScript前端框架，用于构建交互式的、响应式的用户界面。它是一种轻量级、灵活和易于学习的框架，广泛应用于现代Web应用程序开发中。前端框架那么多，为什么Vue.js非学不可？Vue.js的简洁语法和易用性使得它成为构建现代Web应用程序的优秀选择，无论是小型项目还是大型复杂的应用都能发挥出色的效果。Vue.js使用双向绑定的数据模型，将数据和视图进行关联。
报错：数组明明有内容但打印的length是0，学会使用 async 和 await 解决问题
虎康的博客
09-06 2074
因为我们拼接的数据是从接口请求的，而接口请求发送的ajax请求是异步的，因此遇到这种情况，基本上都是一点，你的数组数据来源是异步请求产生的（例如 ajax/axios ），就比如你在ajax的success回调中没有直接使用这个数据，而是赋予了一个全局变量，你此时在ajax的下方打印这个全局变量，便会出现上面的数组有值而长度为0的状况。那个时候的数组长度确实还是0。但这个数组包含修改后的数据。
关于vue3 局部打印功能遇到的问题，到最后怎么实现的！！！
scj0725的博客
02-28 758
最近一个业务，要实现局部打印功能，原本我用三个"el-row"标签写了两行内容一个数据表格。现常识了， window.print()，可想而知是失败的，直接打印了全部网页，获取局部的代码没有样式。依次尝试了其他插架比如说：print-js、vue3-print-nb都不适用，不是说插件不行，这些插件打印element写出来的页面样式，打印的时候多多少少都是有瑕疵的，要么表格显示不全，要么样式没有，我的解决方案是适用了原生的表格，代码如下。
VUE简单解决控制台打印数组为空，但是展开有数据
沉默的小猴子的博客
08-09 1万+
如图，在控制打印的时候数组是空，但是展开可以看到有37条数据。紧接着打印了长度，长度为0. 这个问题我搜了很多解决都是 this.$nextTick(() => { }) 我有个更简单的办法，这个算是异步的一个加载 那就使用延时setTimeout来触发 let rightItems = this.$refs.r_list.getElementsByClassName('proLi...
vue数组在浏览器里可以看到值, 但是length为空
最新发布
m0_46554818的博客
06-07 466
arr数组 length为0, 检查了代码在created 里调用了 this.getEnergyList(); 和 this.initChart(); 问题就在这里, this.initChart用到了getEnergyList里的数据, 造成了数据异步, 把this.initChart(); 放入 this.getEnergyList(); 方法里即可解决问题
vue3 ref 响应式数据赋值的问题，控制台打印更新，但页面未更新
weixin_45578532的博客
10-12 7094
普通的数组对象赋值给ref响应式数组对象，第一遍正常，第二遍控制台打印有数据但是页面没回显
解析Vue2.0和3.0的双向数据绑定原理和异同(带源码)
qq_43429002的博客
08-05 1902
解析Vue2.0和3.0的双向数据绑定原理和异同(带源码) Vue2.0和Vue3.0实现原理 Vue 2.0 Vue2.0实现MVVM(双向数据绑定)的原理是通过 Object.defineProperty 来劫持各个属性的setter、getter，在数据变动时发布消息给订阅者，触发相应的监听回调。 Vue官网也给出了解释: Vue 3.0 实现响应式基于ES6:Proxy Vue2.0和Vue3.0的差异如下: Vue2.0 基于Object.defineProperty，不具备监听数组的能力，需
Vue3开发调试小技巧，在控制台直接打印出Ref的值
05-10 2304
所以Vue官方就考虑到这个确实麻烦，就增加一个客户端格式化打印的方法，直接打印出Ref的值，需要在浏览器里设置：点击这个小齿轮设置。做Vue3开发的都知道，在控制台打印Ref对象的时候，其实需要点击一下才能看到值：是不是很麻烦。
项目常见错误及解决方法-console.log打印数组，数组有元素但长度为0
Alfred的博客
10-14 1万+
在项目中，使用restangular，在成功回调函数中，给数组复制，同时，返回给一个数组变量，在函数后面，打印出现： 数组为空，但是点开又有数据，最终找到原因： 因为开始空数组没赋值，赋值之后，因为是地址引用，那个数组已经被修改了。显示零是原来的长度。但包含修改后的结果。换句话说，就是由于restangular异步请求数据，在执行restangular时（由于异步，此时，开始回调函数还
前端vue3watch监听数组长度
06-06
在上面的示例中，我们使用`watch` API来监听`arr`数组的长度变化，并在控制台打印出新旧值。 请注意，我们使用了`this.arr.length`来获取数组的长度，而不是直接监听数组本身。这是因为Vue 3使用了Proxy来劫持数据...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值