feat(function): useQuerySelector and useQuerySelectorAll

[hairyf]

对问题的清晰和简明的描述

• useQuerySelector
• useQuerySelectorAll

推荐的解决方案

基础实现（useQuerySelector）：

type QuerySelectorMode = 'boundingClientRect' | 'context' | 'fields' | 'node' | 'scrollOffset'

function useQuerySelector(mode: QuerySelectorMode, fields?: ...) {
  const { all = false, fields = {} } = options
  // create manual promise
  const ready = createDeferred()
  // current component instance
  const instance = getCurrentInstance()

  async function query(selector: string) {
    return new Promise((resolve) => {
      ready.then(() => {
        const selectQuery = uni.createSelectorQuery()
        //...
      })
    })
  }

  onMounted(ready.resolve)

  return query
}

function useQuerySelectorAll() {
  // ...
}

// setup
const querySelectorRect = useQuerySelector('boundingClientRect')
const querySelectorRectAll = useQuerySelectorAll('boundingClientRect')
const querySelectorFields = useQuerySelector('fields', {  size: true, ... })

async function getRect() {
  const rect = await querySelectorRect('#id')
}
async function getFields() {
  const rect = await querySelectorFields('#fields-id', { /* overrides options */ })
}

替代方案

No response

额外上下文

No response

检查

• [X] 遵循我们的 行为准则
• [X] 检查是否已经有一个要求相同功能的问题，以避免重复创建。

[ModyQyW]

后悔了，怎么没有“我愿意提交一个 PR”可供你勾选

[ModyQyW]

翻了下记录发现在 0.12.0 移除了 selectorQuery 相关的方法，因为我认为它是一个无状态逻辑方法。能举出一个反例说服我加回来吗？🤔️

[hairyf]

嗨！我貌似没有看到任何相关 selectorQuery 的记录，另外 useSelectorQuery 虽然是无状态的，但它却依赖组合式 API（onMounted 与 getCurrentInstance）

useSelectorQuery 能避免在不同的组件上定义大量重复的链式调用和避免回调地狱，你可以查看 ano-ui#a-collapse-transition 的使用，这很棒！

collapse-transition - preview | a-collapse - preview

噢，对了，它的实际代码量不到 30 行，却能支持所有的查询（boundingClientRect, context, fields, node, scrollOffset）而在页面与组件上使用，却只需要两行代码就可以获取到你想要的信息！

ano-ui 中 useSelectorQuery 的相关实现：

• createQuerySelector
• useQuerySelector
• useQuerySelectorAll

我很乐意提供一个 PR（这没什么困难的）不过我现在正在忙于 vue3-pixi-renderer 的开发，可能会晚一些。

实际上，我并不喜欢讨论所谓的组合式理论，我认为大部分是经验所得 🤔 如果这不能说服你，请关闭这个问题（没关系，我不介意 ❤️

[hairyf]

我看到了 v0.11.0 版本前的 useSelectorQuery 实现，简单来说它并没有减轻应用复杂度，这不是我想要的

[ModyQyW]

我看到了 v0.11.0 版本前的 useSelectorQuery 实现，简单来说它并没有减轻应用复杂度，这不是我想要的

确实，它的作用微乎其微。

我很乐意提供一个 PR（这没什么困难的）

非常欢迎！如果你没有空的话也可以等待我增加这个方法。

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.