uni-app小程序开发踩过的坑之ref无法获取当前元素的宽高数据

        <view id="detailInfoRef" ref="detailInfoRef" class="detailInfo">
          <view id="htmlRef" class="detailInfo-box">
                {
   
   {text}}
          </view>
        </view>

父级，detailInfoRef；子级：htmlRef，要求，根据两个元素的宽高走不同的样式或者逻辑

父级定义好高度，子级内容撑开

方法：

一定要给对应的元素设置id，使用uni.createSelectorQuery().in(this).select('#id名') 获取对应元素

在使用  ：   目标变量.boundingClientRect(data => {
          执行各种赋值或者方法
        }).exec()

注意：

1，这里的方法中的回调函数有这个元素的所有属性，包括宽高等等

2，一定要再this.$nextTick(() => {}执行这个方法，因为最初的时候是没有宽高的，没办法动态获取，获取频率比较高的可以用计时器

let obj= uni.createSelectorQuery().in(this).select('#detailInfoRef')
       obj.boundingClientRect(data => {
          执行各种赋值或者方法)
        }).exec()

methods: {
    hasScrollbar() {
      this.$nextTick(() => {
        let viewDetail = uni.createSelectorQuery().in(this).select('#detailInfoRef')
        viewDetail.boundingClientRect(data => {
          this.detailHeight = data.height
          console.log("detailHeight" + data.height)
        }).exec()
        let viewHtml = uni.createSelectorQuery().in(this).select('#htmlRef')
        viewHtml.boundingClientRect(data => {
          this.htmlHeight = data.height
          console.log("htmlHeight" + data.height)
        }).exec()
        setTimeout(()=>{
          if (this.htmlHeight > this.detailHeight) {
            this.know = false
            执行方法1
          } else {
            this.know = true
            执行方法2
          }
        },100)
      })
    },
}

最后拿到元素的高度最对比就好了