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

相关推荐
街尾杂货店&15 分钟前
css word-spacing属性
前端·css
千叶寻-18 分钟前
正则表达式
前端·javascript·后端·架构·正则表达式·node.js
光影少年5 小时前
angular生态及学习路线
前端·学习·angular.js
記億揺晃着的那天7 小时前
Vue + Element UI 表格自适应高度如何做?
javascript·vue.js·ui
无尽夏_8 小时前
HTML5(前端基础)
前端·html·html5
Jagger_8 小时前
敏捷开发流程-精简版
前端·后端
FIN66688 小时前
昂瑞微冲刺科创板:创新驱动,引领射频芯片国产化新征程
前端·安全·前端框架·信息与通信·芯片
GISer_Jing8 小时前
ByteDance——jy真题
前端·javascript·面试
睡美人的小仙女1278 小时前
浏览器为何屏蔽本地文件路径?
前端
真的想不出名儿8 小时前
Vue 中 props 传递数据的坑
前端·javascript·vue.js