uniapp在vue3组合式写法中获取组件实例的正确姿势

在选项式写法中,in(this)需要指定它在哪个组件实例内部执行，这是为了确保查询的上下文正确。

uni.createSelectorQuery().in(this)

而组合式中是没有this的,这个时候就需要通过getCurrentInstance()来获取当前组件实例：

import { getCurrentInstance } from 'vue'
const instance = getCurrentInstance()
const query = uni.createSelectorQuery().in(instance)

在大多数情况下，直接传入instance到.in()方法作为查询范围应该是足够的，因为无论如何它都将涉及到正确的组件实例。

但是，一些情况可能需要的不仅是实例本身，也需要这个实例与Vue的响应式系统的连接。proxy正是这个连接的直接表示：

而instance 也确实为我们提供了一个组件实例的响应式代理:proxy, 使用instance.proxy有助于确保范围查询严格局限在Vue管理的响应式组件实例上，特别是这涉及到组件实例中的响应式数据。这可以防止潜在的问题，例如当查询依赖于组件数据的时候。

uni.createSelectorQuery().in(instance.proxy)

因此，大多数情况下uni.createSelectorQuery().in(instance)和uni.createSelectorQuery().in(instance.proxy)可交换使用，但使用.proxy可以给你更严格的保障，特别是如果你需要依赖于响应式数据来进行选择器查询时。