Vue3_组件传参问题

并不是任意两个组件之间都可以进行参数传递

父传子

子传父

兄弟传参(先子传父,再父传给另一个子)

现在要向父组件发送参数

即Navigator.vue向App.vue发送参数

clike 复制代码
<script setup>

// 用于定义向父组件提交数据的事件以及正式的提交数据
import {defineEmits} from 'vue'

// 定义一个向父组件提交数据的事件   事件名称自定义
const emits = defineEmits(["sendMenu"])

// 定义提交数据的方法

function send(data){
    emits('sendMenu',data)
}

</script>
<template>
<div>
    <ul>
        <li @click="send('学院管理')">学院管理</li>
        <li @click="send('图书管理')">图书管理</li>
        <li @click="send('请假管理')">请假管理</li>
        <li @click="send('考试管理')">考试管理</li>
        <li @click="send('班级管理')">班级管理</li>
        <li @click="send('教师管理')">教师管理</li>
    </ul>
</div>

</template>

<style scoped>

</style>

父组件进行接收,并传给另一个子组件

另一个子组件接收


相关推荐
hiahiahia12317 分钟前
实现完整 Tool Dispatcher
开发语言·前端
IT_陈寒35 分钟前
Java线程池这破玩意,差点让我周末加班排查到凌晨
前端·人工智能·后端
Mr_Mao1 小时前
告别选型困难!集 VueUse、ahooks、Mantine 于一身:286 个 Hook 的 ReaUse 来了
前端·javascript·react.js
泡海椒2 小时前
趋势分析报表:jquick-pdf折线图PDF生成实战
java·大数据·运维·服务器·前端·pdf
qwfy2 小时前
我要用 AI-native 架构,从零重建一套制造业 ERP/MES
vue.js·spring boot·架构
默_笙2 小时前
🚙 一条腿走路会摔:ES 关键词检索、混合召回与 ReRank 裁判
前端·javascript
YIAN2 小时前
从跨域代理到 WebSocket:梳理前端实时通信的底层逻辑与完整实践
前端·websocket
一曲终散2 小时前
创建 SVG 图标预览页面:从零实现到解决 CORS 问题
前端
静默回滚3 小时前
iPhone照片电脑上打不开:HEIC解码从原理到WASM
前端
dsyyyyy11013 小时前
Vue 3 Watch 监视完全指南
前端·javascript·vue.js