vue3父组件通过ref调用子组件的方法

Index.vue

javascript 复制代码
<script setup>
import { ref, onMounted } from 'vue'
import Child from './Child.vue'
import './index.css'

const child = ref(null)

onMounted(() => {
  child.value.handleGetValue()
})
</script>

<template>
  <div class="m-home-wrap">
    <Child ref="child"></Child>
    <div class="m-home-demo"></div>
  </div>
</template>

<style></style>

Child.vue:

javascript 复制代码
<template>
  <div>child</div>
</template>

<script>
export default {
  methods: {
    handleGetValue() {
      console.log('子组件的方法')
    }
  }
}
</script>

<style>

</style>

人工智能学习网站

https://chat.xutongbao.top

相关推荐
sensen_kiss26 分钟前
CAN302 电子商务技术 Pt.1 Web技术导论
前端·网络·学习
ProgramHan37 分钟前
十大排行榜——前端语言及要介绍
前端
Patrick_Wilson39 分钟前
你删过 lock 文件吗?聊聊包管理器迁移中 90% 的人会踩的坑
javascript·npm·前端工程化
早點睡39042 分钟前
ReactNative项目OpenHarmony三方库集成实战:react-native-permissions
javascript·react native·react.js
氢灵子1 小时前
Fixed 定位的失效问题
前端·javascript·css
英俊潇洒美少年1 小时前
函数组件(Hooks)的 **10 大优点**
开发语言·javascript·react.js
haibindev1 小时前
把近5万个源文件喂给AI之前,我先做了一件事
java·前端·c++·ai编程·代码审计·架构分析
方安乐1 小时前
Javascript工具库:classnames
开发语言·javascript·ecmascript
labixiong1 小时前
React Hooks 闭包陷阱:高级场景与深度思考
前端·javascript·react.js
颜酱1 小时前
回溯算法专项突破练习(1)
javascript·后端·算法