当前位置:首页 > 日记 > 正文

解决vue里碰到 $refs 的问题的方法

解决vue里碰到 $refs 的问题的方法

本篇文章介绍了vue里碰到 $refs 的问题,分享给大家,希望能帮助大家解决问题

记录困惑自己一个简单的问题...(瞬间感觉官方文档的强大)

在自己做的一个项目中,遇到一个列表页,根据id能进入详情页(动态匹配路由),详情页是单独的一个组件,在这个详情的组件里,我想获取内容给你区域的高度,以此来判断对底部按钮显示的位置,但是在ref的时候,就是获取不到该标签,在mounted钩子函数里打印 this.$refs,也能看到这个值,但就就是点不出来(this.$refs这个对象里这个值,但是就是获取不到,我打印的是个假值?)

在mounted函数,打印的每次都是undefined。郁闷啊...为什么啊...

重新起个项目看看..

全部正常的打印,我擦...蒙蔽了...

好吧,网上看看有没有遇到类似的...看来是我自己比较挫,没有什么资源,看来还是自己的问题,这个时候,就是看文档了...

  

感觉自己没有没有什么错啊,是按上面做的...,但是作者特别强调了$refs 不是响应式的。额,想想...不对...,我那个组件好像就是响应式,或根据id来显示不同的数据。额,好吧.。这里ref只能在根组件,才能获取,其他的都获取不到。但是能打印出来,能看到...  

虽然知道了浅显的原因所在,但是自己的问题没有解决,好吧,那就暴力点吧.直接操作dom。通过控制dom来获取页面的高度。

总结: 之前就有个人和我说过,可以把$refs 当做id来看,id是唯一的,是不变的。嗯,$refs 不是响应式的。 挺像...

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

相关文章

JavaScript编程设计模式之构造器模

JavaScript编程设计模式之构造器模

编程,设计模式,模式,构造器,实例分析,本文实例讲述了JavaScript编程设计模式之构造器模式。分享给大家供大家参考,具体如下:经典的OOP语言中,构造器(也叫构造函数)是一个用于初始化对象的特殊方法。在JS中,因为一切皆对象,对象构造器经常被提起。…

ps怎么制作很梦幻的抽丝花朵效果?

ps怎么制作很梦幻的抽丝花朵效果?

效果,梦幻,电脑软件,ps,ps中想要使用滤镜制作抽丝效果的花朵,该怎么绘制呢?下面我们就来看看详细的教程。软件名称:Adobe photoshop 7.01 官方正式简体中文版软件大小:154MB更新时间:2013-04-191、首先启动Photoshop cs5,执行文件-新建命令,新建一…

AI文件怎么另存为psd分层文件?

AI文件怎么另存为psd分层文件?

文件,分层,另存为,电脑软件,AI,成psd分层文件方便我们后期处理,该怎么将ai文件保存为psd分层文件呢?下面我们就来看看详细的教程。软件名称:Adobe Illustrator CS6 (AI cs6) 精简绿色中文版(32位+64位)软件大小:205MB更新时间:2014-05-111、很多…

ppt如何绘制扇形和半圆的形状图形

ppt如何绘制扇形和半圆的形状图形

扇形,绘制,图形绘制,图形,半圆,  PPT中的形状中有很多图形,ppt中想要绘制一些图形,该怎么使用形状功能绘制扇形和半圆。以下是小编为您带来的关于ppt绘制扇形和半圆的形状,希望对您有所帮助。ppt绘制扇形和半圆的形状1、点击插入---形状 ---…

ppt幻灯片如何制作一个演示结束的

ppt幻灯片如何制作一个演示结束的

动画,幻灯片,演示,结束,电脑软件,  ppt幻灯片播放结束以后,想要播放一个结束的动画,该怎么设计这个动画才能完美的收尾。以下是小编为您带来的关于ppt幻灯片制作一个演示结束的动画,希望对您有所帮助。ppt幻灯片制作一个演示结束的动画1、首…

详解JavaScript调用栈、尾递归和手

详解JavaScript调用栈、尾递归和手

尾递归,优化,调用栈,详解,电脑软件,调用栈(Call Stack)调用栈(Call Stack)是一个基本的计算机概念,这里引入一个概念:栈帧。栈帧是指为一个函数调用单独分配的那部分栈空间。当运行的程序从当前函数调用另外一个函数时,就会为下一个函数建立一个新…

qq如何设置接收文件夹怎么设置qq接

qq如何设置接收文件夹怎么设置qq接

设置,文件,方法,如何设置,电脑软件,  qq接受到好友的文件,有时候会找不到,那么怎么设置指定的接收文件的文件夹方便自己寻找呢?今天小编给你分享一下qq设置接收文件夹的操作方法,欢迎阅读。qq设置接收文件夹的方法点击打开qq主面板的系统设…

浅谈mint-ui loadmore组件注意的问

浅谈mint-ui loadmore组件注意的问

组件,浅谈,电脑软件,ui,mint,如下所示:loadTop(){ this.$store.dispatch('getNewsList',{channelId:this.id,page:0,size:this.size}); this.$refs.loadmore.onTopLoaded();},比如在做下拉刷新的时候,切记在下拉刷新的函数中要加this.$re…

Fireworks快捷键怎么自定义设置?

Fireworks快捷键怎么自定义设置?

快捷键,设置,自定义,电脑软件,Fireworks,想必很多ps大仙都有自己的擅长作图软件,对于一般简单的图像处理,推荐大家使用Fireworks,简单快捷,用多了快捷键,速度那叫哇哇的...当然很多快捷键记不住的新人怎么办,看这里,定制自己的快捷键。Fireworks8.…

JavaScript获取tr td 的三种方式全

JavaScript获取tr td 的三种方式全

推荐,三种,方式,电脑软件,JavaScript, /* 第一种,原生的js,先获取table然后获取tr标签,然后遍历td */// $('#selectIds').val("");// var table = document.getElementById("tb_table");//获取第一个表格 // var a…

一篇文章让你彻底弄懂JS的事件冒泡

一篇文章让你彻底弄懂JS的事件冒泡

事件捕获,事件冒泡,让你,一篇文章,电脑软件,在学校,听老师讲解事件冒泡和事件捕获机制的时候跟听天书一样,只依稀记得IE使用的是事件冒泡,其他浏览器则是事件捕获。当时的我,把它当成IE浏览器兼容问题,所以没有深究(IE8以下版本的浏览器已基本退…

在word2013如何自动生成目录

在word2013如何自动生成目录

自动生成,目录,电脑软件,  很多朋友不知道word2013怎么自动生成目录,生成目录对word2013新手来说是一个难关,不过如果多练习几遍的话,就能够熟练操作咯,那么下面就由小编为您分享下word2013自动生成目录的技巧,希望能帮助您。自动生成目录的步…