vue中元素上加上ref属性取值，相当于取整个元素的，和$("#id")类似。但是要用此属性需要了解加载的时间，从官网上可以看到
关于 ref 注册时间的重要说明：因为 ref 本身是作为渲染结果被创建的，在初始渲染的时候你不能访问它们 - 它们还不存在！$refs 也不是响应式的，因此你不应该试图用它在模板中做数据绑定。
一般用法就是在mounted方法中加入this.$nextTick
mounted() {
this.$nextTick(() => { // 页面渲染完成后的回调
this.ul_Height=this.$refs.ulheight.offsetHeight
})
}
//this.$refs.ulheight==undefined
但是如果$refs在el-dialog中用上述方法还是会undefined,如下：
<el-dialog
class="fileLibraryDialog"
title="文件库"
:visible.sync="fileLibraryData.isShow"
>
<ul ref="ulheight" class="groupTree">
……
</ul>
</el-dialog>
解决的方法就是在el-dialog中加入回调函数@open，然后在回调函数方法中用this.$nextTick。
<el-dialog
class="fileLibraryDialog"
@open="getUlHeight"
title="文件库"
:visible.sync="fileLibraryData.isShow"
>
<ul ref="ulheight" class="groupTree">
……
</ul>
</el-dialog>
//js部分:
methods:{
getUlHeight(){
this.$nextTick(()=>{
this.ul_Height=this.$refs.ulheight.offsetHeight
})
}
}
