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

相关推荐
jerrywus8 小时前
chrome-devtools-mcp 总弹授权、抢标签页?我是这样一步步配好的
前端·agent·mcp
橘猫走江湖8 小时前
Vue 3 虚拟 DOM:作用、触发机制,以及怎样变成页面上的真实节点
前端·vue.js·dom
weixin_BYSJ19878 小时前
电竞先锋网站---附源码02032
java·vue.js·spring boot·python·django·tomcat·php
郑州光合科技余经理9 小时前
同城小程序开发:同一笔单在用户端和商家端各显示到哪
android·java·开发语言·前端·后端·uni-app·php
zzppff1p9 小时前
用AI写了个小游戏
前端·javascript
陈随易9 小时前
终于 Token 自由了,AI 开支下降 10 倍
前端·后端·程序员
gqc5810 小时前
Markdown 写完怎么验证?我现在的 4 步本地检查流程
前端
普通人610 小时前
uniapp模版JS
开发语言·javascript·小程序·uni-app·1024程序员节
KumaoHub10 小时前
棋牌游戏开发中聊天文本的长度限制与安全显示
javascript
计算机魔术师10 小时前
我重算了新云的账,发现亏的不是算力,是时间
前端