vue 3 父组件调用子组件属性
时间: 2023-09-21 09:07:06 浏览: 102
vue 父组件中调用子组件函数的方法
在Vue 3中,父组件可以通过使用ref来定义子组件实例,并通过调用实例来访问子组件的数据和方法。首先,在父组件的模板中使用ref指令关联子组件,例如`<child ref="childComp"/>`。然后,在父组件的`<script setup>`中,使用`import`导入子组件,并定义子组件实例,名称要和ref相同,例如`const childComp = ref(null)`。接下来,可以通过调用子组件实例来访问子组件的属性,例如获取子组件的数据`let msg = childComp.value.state.title`,或者调用子组件的方法`childComp.value.play()`。这样,父组件就可以通过ref来调用子组件的属性了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [vue3父组件调用子组件的方法](https://blog.csdn.net/weixin_42252416/article/details/128001894)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *3* [vue 父组件中调用子组件函数的方法](https://download.csdn.net/download/weixin_38711972/13627886)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文