feat(组件通信): 在App.ku.vue中暴露exposeRef并通过ref在about.vue中访问
在App.ku.vue中使用defineExpose暴露exposeRef变量,并在about.vue中通过ref引用访问该变量。添加onReady和onShow生命周期钩子来验证访问时机
This commit is contained in:
@@ -12,6 +12,12 @@ onShow(() => {
|
||||
})
|
||||
|
||||
const helloKuRoot = ref('Hello AppKuVue')
|
||||
|
||||
const exposeRef = ref('this is form app.Ku.vue')
|
||||
|
||||
defineExpose({
|
||||
exposeRef,
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -64,9 +64,18 @@ function setTabbarBadge() {
|
||||
tabbarStore.setTabbarItemBadge(1, 100)
|
||||
}
|
||||
// #endregion
|
||||
|
||||
const uniKuRoot = ref()
|
||||
// 结论:(同上)第一次通过onShow获取不到,但是可以通过 onReady获取到,后面就可以通过onShow获取到了
|
||||
onReady(() => {
|
||||
console.log('onReady uniKuRoot exposeRef', uniKuRoot.value?.exposeRef)
|
||||
})
|
||||
onShow(() => {
|
||||
console.log('onShow uniKuRoot exposeRef', uniKuRoot.value?.exposeRef)
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<template root="uniKuRoot">
|
||||
<view>
|
||||
<view class="mt-8 text-center text-xl text-gray-400">
|
||||
请求调用、unocss、static图片
|
||||
|
||||
Reference in New Issue
Block a user