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

相关推荐
三门9 分钟前
web接入扣子私有化智能体
前端
林小帅10 分钟前
AI “自动驾驶” 的使用分享
前端
起名时在学Aiifox18 分钟前
深入解析 Electron 打包中的 EPERM: operation not permitted 错误
前端·javascript·electron
游戏开发爱好者818 分钟前
Fiddler抓包工具完整教程 HTTPHTTPS抓包、代理配置与API调试实战技巧(开发者进阶指南)
前端·测试工具·ios·小程序·fiddler·uni-app·webview
hachi031339 分钟前
Vue中input disabled时点击事件不触发怎么办?
javascript·vue.js·ecmascript
BestSongC43 分钟前
基于VUE和FastAPI的行人目标检测系统
vue.js·人工智能·yolo·目标检测·fastapi
漫天黄叶远飞1 小时前
别再把对象当“字典”!JS 零基础也能看懂的“属性账本”拆解笔记
javascript
华仔啊1 小时前
20个CSS实用技巧,10分钟从小白变大神!
前端·css
起名时在学Aiifox1 小时前
Vue3 + Element Plus 表格排序实战:基于状态字段的智能排序方案
前端·javascript·vue.js·element plus
再吃一根胡萝卜1 小时前
从 Element UI 到 Element Plus:el-table 大数据量性能为何下降了?
前端