vue渲染页面，获取不到元素

最新推荐文章于 2024-06-26 10:05:35 发布
最新推荐文章于 2024-06-26 10:05:35 发布
阅读量1w 收藏 3
点赞数 2
分类专栏： vue 文章标签： vue 页面渲染
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/etemal_bright/article/details/79413051
版权

遇到的问题是 我已经通过调取后台接口拿到数据，付给全局变量，在vue里面渲染，但是当获取元素的时候得到的是空的数组

1，拿到了数据

2，初始化了数据


3，渲染页面


4，获取元素 得到的imgs是【】


5，解决办法 加上this.$nextTick



阿奇是只猪
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
获取不到html页面上的元素,Vue v-for渲染页面，获取不到DOM元素解析
weixin_35621029的博客
06-04 1529
v-for 渲染循环渲染页面的出现让我们告别了繁琐的JS拼接，在开发上面节省了很多时间。近期在开发中发现了在某些特定情况下，出现了获取不到渲染出来的DOM元素的情况，原因身为小白的我暂时还没搞清楚(忘大佬指出)，但是却得出来初步的解决方案。HTML 代遇新是直朋能到码{{item.age}}JS 代码(错误代码比抖朋要插支一圈不者地)// 错误代码示例一var vm = new Vue({el: ...
详解vue渲染从后台获取的json数据
10-19
在实际开发中，我们经常需要从后端服务器获取JSON数据并将其渲染到Vue实例中。Vue.js 提供了便捷的方法来处理这种场景，让我们深入探讨这个问题。 首先，Vue实例的`data`选项是用来定义组件的状态，它是一个对象，...
vue3.0项目中，成功获取后端数据，却发现渲染失败，页面还是没数据？
coder184的博客
02-11 1397
因为响应性不存在的情况下，HTML不会检测任何变量&常量的变化，即使它真的变化了，但不会进行检测，仍然使用最开始的值，所以渲染失败，页面没有数据。注：el-tree是element-plus的树形组件，无须过多关注，利用其它组件完成视图部分即可，建议后续再深入。很明显，ref更简洁，同时reactive，对响应性的维持，更加苛刻，需要借助push等函数。解决的办法：赋予响应性即可，使用ref()或者reactive()。渲染失败的原因，是你声明的东西，不具备响应性，或者响应性丢失。
Vue 如何实现获取 dom 元素（父组件获取子组件的dom / ref），真的很详细
最新发布
(黎子)人生编码
06-26 1928
在 Vue 中，DOM 元素通常指的是由 Vue 实例管理的 HTML 元素。Vue 使用虚拟 DOM 来提高性能，这意味着实际的 DOM 操作比传统方法更少、更高效。ref是 Vue 中的一个属性，用于给元素或子组件注册引用信息。引用信息将会在组件的$refs对象上注册。你可以使用ref来访问 DOM 元素或子组件实例。
在vue项目中，数据已经在页面渲染，但在后续操作时获取不到数据
M030124的博客
12-14 592
如下图。
vue.js渲染前端数据，进入页面获取不到标签
xm的博客
04-28 2516
获取不到数据主要是因为页面还没渲染完成，js已经执行，导致生成的html标签获取不到，可以在 $(function(){ //… }) $(function(){ setTimeout("getLaterData()",100);//页面渲染完成后0.1s再执行，这样就可以获取动态生成的标签 }) 里面执行 setTimeout(“getLaterData(...
vue项目中，数据还没获取到，页面已经渲染，导致页面没有数据
编程小白的博客
02-27 950
vue项目中，数据还没获取到，页面已经渲染，导致页面没有数据
Vue3中页面已渲染，但没有数据/已经获得数据，页面没有显示问题
weixin_46105377的博客
03-23 1666
解决方法非常简单：使用v-if(推荐)或v-show
vue开发中，数据还没获取，页面已经渲染，导致页面没有数据
热门推荐
weixin_48677331的博客
12-28 2万+
在使用vue的时候，经常会遇到这种问题：异步请求，或者是通过组件传值获取数据时，部分页面会在数据获取之前就渲染，导致数据加载不出来。 如何解决？ 使用 v-if 根据需求,可以在vue生命周期beforeCreate，created的时候就调用接口获取数据，在成功拿到数据之后的回调函数里面，控制页面显示，可以最大程度上避免页面跳动的问题。由于渲染和请求是异步的，我们可以等到数据请求回来之后，再把页面放出来。 上代码 <h4 v-if="isShow">{{ data }}</h4>
浅谈vue异步数据影响页面渲染
10-16
在定时器的回调函数中，如果检测到sessionStorage中已经存在数据（例如`user`对象），则清除定时器，修改`appShow`为true，隐藏加载提示，并通过改变DOM元素的样式来完成页面渲染。 需要注意的是，定时器的使用并不...
Vue在页面数据渲染完成之后的调用方法
10-18
在Vue.js开发中，有时我们需要确保页面数据完全渲染完成后执行某些操作，比如计算元素高度、初始化第三方库等。Vue提供了一种机制来处理这种情况，即`$nextTick`方法和`watch`对象。下面我们将详细讲解这两个关键...
解决vue 路由变化页面数据不刷新的问题
08-27
本篇文章将深入探讨如何解决Vue路由变化时页面数据不刷新的问题。 首先，我们需要理解Vue Router的工作原理。Vue Router采用的是单页面应用程序（SPA）模式，当路由改变时，视图（View）通常应该根据新的路由参数...
解决vue页面DOM操作不生效的问题
11-28
猜测是vue使用的虚拟DOM，使得页面虽然已经渲染出来，但在Vue实例中让处在在虚拟DOM中，无法获取。 解决方法： 使用Vue.nextTick，看下官方材料： ‘在下次 DOM 更新循环结束之后执行延迟回调’，这句话不是特别...
vue3初始化时父组件传给子组件值，子组件获取不到值
qq_43474235的博客
05-21 4553
首先，分析原因，因为先渲染子组件的DOM后渲染父组件，但是当父组件获取到值后，子组件已经渲染完成，这样就导致初始化时，子组件获取不到值，可以通过，先判断数据是否获取到，再渲染子组件来解决这个问题。最近的项目开发也算是正式的接触到了vue3,在使用过程中也遇到了好多坑，比如、父组件给子组件传值，子组件在onMounted中获取不到值，使用reactive定义数组，赋不了值等等。赋不上值的原因是，reactive使用的Object.assign()进行对数据的浅拷贝，导致数据无法赋值。
vue3父组件异步获取后端数据，子组件无法及时渲染问题分析、解决及使用suspense组件进行骨架屏优化
reason125132的博客
05-04 9411
vue3中一个常见场景，父组件向后端异步获取数据，再父子传参给子组件，由子组件来渲染获取到的数据。
解决vue.js 数据渲染成功仍报错的问题
Quan的博客
02-20 2417
最近在做一个vue项目，用的是官方推荐的axios请求数据，数据结构是一级对象嵌套二级对象，发现一级对象数据渲染不报错，二级数据渲染报错。很是郁闷！data函数如下 ? 1 2 3 4 5 6 7 8 9 export default {  name: 'hello',  data()...
关于Vue中页面成功渲染数据undefined的问题
蔡定交
03-04 4179
undefined问题 其实就是数据还没拿到就渲染了一次造成的，解决的办法也有很多，个人觉得不影响使用，但老有人问为啥会一开始显示undefined，也懒得解释了，改吧。。 方法 网上搜了一下，大概就是给个默认值、判断字段值存在时再显示等等。个人觉得还是来个干脆点的。 用watch监听数据，让数据加载完成后再显示dom，数据获取期间显示加载中…… <template> <view style="background-color: #ffe1cd;height: 100vh;backgro
【Vue】关于页面渲染完成之前拿不到数据的问题
wangffan12的博客
02-27 774
watch的使用 动态生成一个Tree 挂载阶段拿不到数据
vue v-else中使用document.getElementById获取不到值的问题
Spy003的博客
08-20 3226
然后我尝试，把含有id组件写在v-if中，这时可以获取到组件了，但是当v-else的组件显示出来以后，发现同一个位置，v-else页面控件对应的位置也能获取到这个id，于是我发现，：我把含有id的标签写在了v-else中，结果，通过document.getElementById获取不到组件，这个问题困扰了我两天，我经过反复排查，终于定位到了问题出现在v-if / v-else 判断属性中，vue v-else中使用document.getElementById获取不到值的问题。
vue中在mounted中为什么获取不到元素
05-30
在Vue的mounted生命周期钩子函数中获取元素时，有可能会出现获取不到元素的情况。这可能是因为元素还没有完成渲染，或者是因为DOM元素还没有被添加到页面中。 为了避免这种情况，可以在Vue的nextTick方法中获取元素...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值