uni-app作为一个使用Vue.js开发所有前端应用的框架，提供了跨平台的能力，它允许开发者编写一次代码，然后发布到iOS、Android、Web（包括各种小程序）等多个平台。在开发过程中，经常会遇到需要获取页面元素宽高的需求，尤其是在进行页面布局调整时，元素的实际尺寸就变得尤为重要。
在uni-app中获取元素宽高的方法通常涉及到了组件的生命周期函数以及uni提供的API。由于页面在初始化和渲染的过程中，DOM元素可能还未完全渲染完毕，直接获取宽度和高度可能会得到不正确的值。因此，获取元素宽高的正确时机和方式显得尤为重要。
在uni-app中，推荐使用`uni.createSelectorQuery()`方法来获取元素的宽高。这个方法属于uni提供的API，用于查询组件或节点信息。它返回一个`SelectorQuery`对象，通过这个对象可以进行一些查询操作，其中`boundingClientRect()`方法可以获取节点的布局信息。
在组件的生命周期函数中，最常用的是`mounted`钩子，它会在组件挂载到DOM后执行。但是在某些情况下，直接在`mounted`中获取元素宽高可能会因为页面还未完全渲染完毕而获取不到正确的尺寸。为了解决这个问题，可以使用`setTimout`方法延迟获取，或者使用`this.$nextTick`确保在下一个DOM更新循环之后执行。
文档中提供的两种写法都是解决这个问题的有效手段。第一种方法是使用回调函数来检查`boundingClientRect`的结果。如果`result`存在，则说明成功获取到元素的尺寸，打印出来；如果不存在，则递归调用`getDescBox`函数，直到获取到尺寸为止。这种方法直接使用了回调函数的嵌套，虽然能够达到目的，但可能会造成代码的冗余和可读性的下降。
第二种方法是使用`exec`函数的回调。首先执行查询，然后在回调函数中处理结果。如果查询到的结果数组`res[0]`存在，就直接获取高度并赋值给`descHeight`；如果不存在，说明元素还未渲染完成，此时使用`this.$nextTick`来确保在下一个DOM更新循环之后再次执行获取尺寸的操作。这种方法较为简洁，且能够更好地利用uni-app的响应式系统。
在实际开发中，我们还可以结合`watch`来监听某些数据的变化，当数据变化时，触发获取尺寸的操作，这样可以更加灵活地处理不同场景下的需求。
总结来说，获取组件中元素的宽高在uni-app中并不是一件特别困难的事情，关键是要掌握正确的时机和方法。通过使用`uni.createSelectorQuery()`结合生命周期函数或者`$nextTick`，可以有效地解决在页面渲染过程中元素尺寸尚未确定的问题，从而获取到正确的元素尺寸信息，以支持复杂的布局调整和数据绑定等操作。同时，开发者需要理解这些API的工作原理和生命周期钩子的执行时机，以便在开发中合理运用，提高开发效率和应用性能。
