首页 web前端 Vue.js vuejs 获取不到dom怎么办

vuejs 获取不到dom怎么办

Nov 04, 2021 am 11:40 AM
dom vuejs

vuejs获取不到dom的解决办法:1、打开相应的js文件;2、在获取页面元素的外层套上“this.$nextTick”即可获取到DOM元素。

vuejs 获取不到dom怎么办

本文操作环境:Windows7系统、Vue2.9.6版、DELL G3电脑

vuejs 获取不到dom怎么办?

Vue -- 动态渲染的数据在页面获取不到DOM元素

问题:

通过后台接口获取的数据,在页面中正常显示,但获取不到DOM元素(可以console出,但获取不到子元素)

this.$nextTick之前

614262f976b72e0015d869bdadd5af8.png

解决办法如下

在获取页面元素的外层套上this.$nextTick

this.$nextTick(function(){
      var imgs = this.$refs.imgs;
      console.log("imgs",imgs);
      console.log("imgs[0]",imgs[0]);
})
登录后复制

this.$nextTick之后

55025467a987f79d4d1ac7b8f8d1390.png

推荐学习:《最新的5个vue.js视频教程精选

以上是vuejs 获取不到dom怎么办的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1655
14
CakePHP 教程
1414
52
Laravel 教程
1307
25
PHP教程
1254
29
C# 教程
1228
24
使用Vue.js和Kotlin语言开发安卓应用的一些技巧 使用Vue.js和Kotlin语言开发安卓应用的一些技巧 Jul 31, 2023 pm 02:17 PM

使用Vue.js和Kotlin语言开发安卓应用的一些技巧随着移动应用的普及和用户需求的不断增长,安卓应用的开发越来越受到开发者的关注。在开发安卓应用时,选择合适的技术栈至关重要。近年来,Vue.js和Kotlin语言逐渐成为安卓应用开发的热门选择。本文将介绍使用Vue.js和Kotlin语言开发安卓应用的一些技巧,并给出相应的代码示例。一、搭建开发环境在开始

使用Vue.js和Python开发数据可视化应用的一些技巧 使用Vue.js和Python开发数据可视化应用的一些技巧 Jul 31, 2023 pm 07:53 PM

使用Vue.js和Python开发数据可视化应用的一些技巧引言:随着大数据时代的到来,数据可视化成为了一种重要的解决方案。而在数据可视化应用的开发中,Vue.js和Python的组合能够提供灵活性和强大的功能。本文将分享一些使用Vue.js和Python开发数据可视化应用的技巧,并附上相应的代码示例。一、Vue.js简介Vue.js是一款轻量级的JavaSc

如何使用Vue实现仿QQ聊天气泡特效 如何使用Vue实现仿QQ聊天气泡特效 Sep 20, 2023 pm 02:27 PM

如何使用Vue实现仿QQ聊天气泡特效在现如今的社交时代,聊天功能已经成为了手机应用和网页应用的核心功能之一。而聊天界面中最常见的元素之一就是聊天气泡,它可以清晰地将发送者和接收者的信息区分开来,有效地提高了信息的可读性。本文将介绍如何使用Vue实现仿QQ聊天气泡特效,以及提供具体的代码示例。首先,我们需要创建一个Vue组件来表示聊天气泡。组件包含两个主要部分

Vue.js与Lua语言的融合,构建游戏开发的前端引擎的最佳实践和经验分享 Vue.js与Lua语言的融合,构建游戏开发的前端引擎的最佳实践和经验分享 Aug 01, 2023 pm 08:14 PM

Vue.js与Lua语言的融合,构建游戏开发的前端引擎的最佳实践和经验分享引言:随着游戏开发的不断发展,游戏前端引擎的选择成为了一个重要的决策。在这些选择中,Vue.js框架和Lua语言都成为了众多开发者的关注点。Vue.js作为一款流行的前端框架具有丰富的生态系统和便捷的开发方式,而Lua语言则因其轻量级和高效性能在游戏开发中得到广泛应用。本文将探讨如何将

如何使用PHP和Vue.js实现图表上的数据筛选和排序功能 如何使用PHP和Vue.js实现图表上的数据筛选和排序功能 Aug 27, 2023 am 11:51 AM

如何使用PHP和Vue.js实现图表上的数据筛选和排序功能在网页开发中,图表是一种非常常见的数据展示方式。使用PHP和Vue.js可以轻松实现图表上的数据筛选和排序功能,使用户能够自定义查看图表上的数据,提高数据的可视化效果和用户体验。首先,我们需要准备一组数据供图表使用。假设我们有一个数据表格,包含姓名、年龄和成绩三列,数据如下:姓名年龄成绩张三1890李

使用Vue.js和Perl语言开发高效的网络爬虫和数据抓取工具 使用Vue.js和Perl语言开发高效的网络爬虫和数据抓取工具 Jul 31, 2023 pm 06:43 PM

使用Vue.js和Perl语言开发高效的网络爬虫和数据抓取工具近年来,随着互联网的迅猛发展和数据的日益重要,网络爬虫和数据抓取工具的需求也越来越大。在这个背景下,结合Vue.js和Perl语言开发高效的网络爬虫和数据抓取工具是一种不错的选择。本文将介绍如何使用Vue.js和Perl语言开发这样一个工具,并附上相应的代码示例。一、Vue.js和Perl语言的介

使用Vue.js和Kotlin语言开发国际化支持的移动应用解决方案 使用Vue.js和Kotlin语言开发国际化支持的移动应用解决方案 Jul 31, 2023 pm 12:01 PM

使用Vue.js和Kotlin语言开发国际化支持的移动应用解决方案随着全球化进程的加速进行,越来越多的移动应用需要提供多语言支持来满足全球用户的需求。在开发过程中,我们可以使用Vue.js和Kotlin语言来实现国际化的功能,使应用能够在不同的语言环境下正常运行。一、Vue.js国际化支持Vue.js是一款流行的JavaScript框架,提供了丰富的工具和特

Vue.js与Dart语言的集成,构建跨平台移动应用的思路 Vue.js与Dart语言的集成,构建跨平台移动应用的思路 Jul 30, 2023 pm 10:33 PM

Vue.js与Dart语言的集成,构建跨平台移动应用的思路在移动应用开发领域,跨平台的开发框架得到了越来越多的关注。Vue.js是一种用于构建用户界面的JavaScript框架,而Dart语言是由Google开发的一种用于构建跨平台应用的语言。本文将探讨如何将Vue.js与Dart语言集成,以构建跨平台移动应用。一、Vue.js简介Vue.js被认为是一种轻

See all articles