editor组件获取实例代码不同的原因:
采用 uni.createSelectorQuery()返回一个 SelectorQuery 对象实例。可以在这个实例上使用 select 等方法选择节点,但初始时,选择器仅选取页面范围的节点,不会选取任何自定义组件中的节点,就会导致在自定义组件中无法正确获取实例。需采用selectorQuery.in(component)将选择器的选取范围更改为自定义组件 component 内,返回一个 SelectorQuery 对象实例。
具体获取实例代码如下:
// editor组件 放置在页面中采用下列代码获取实例
import { ref } from 'vue';
const editorCtx = ref<any>(null)
// 需要在 editor组件 @ready后执行下列代码
uni.createSelectorQuery()
.select('#editor')
.context((res) => {
//@ts-ignore
editorCtx.value = res.context
})
.exec()
// editor组件 放置在自定义组件中采用下列代码获取实例
import { ref, getCurrentInstance } from 'vue';
const instance = getCurrentInstance(); // 需放置在引入内容下方(setup 中)
const editorCtx = ref<any>(null)
// 需要在 editor组件 @ready后执行下列代码
// @ts-ignore
const scope = instance?.proxy
if (!scope) return
uni.createSelectorQuery()
.in(scope)
.select('#editor')
.context(res => {
// @ts-ignore
editorCtx.value = res.context
})
.exec()