Vue3-组合式API下的父传子和子传父

组合式API下的父传子

基本思想:

1.父组件中给子组件绑定组件

2.子组件内部通过props选项接收

复制代码
const props=defineProps({属性名:类型})

由于script上写了setup,所以无法直接配置props选项,所以需要借助于"编译器宏"函数接收传递的数据

js中访问传递的数据:props.变量名

模板中:{{变量名}}

如果传递的是一个变量,那么父组件中引入的子组件传递的数据要写成:

复制代码
<SonCom :message="message"></SonCom>

defineProps原理:就是编译阶段的一个标识,实际编译器解析时,遇到后会进行编译转换

组合式API下的子传父

基本思想:

1.父组件中给子组件标签通过@绑定事件

2.子组件内部通过emit方法触发事件

复制代码
const emit=defineEmits(['事件名'])
emit('事件名',参数)
相关推荐
奎叔3 分钟前
Flutter 异常处理体系:从捕获、转换到恢复
前端
心念枕惊6 分钟前
.NET CORE 授权进阶-角色、策略与动态权限实现
java·前端·.netcore
小徐_23338 分钟前
寓言故事一则:狗猛酒酸
前端·ai编程
xiaobaoyu26 分钟前
vue2+element开发中问题和解决方式
前端
KaMeidebaby27 分钟前
卡梅德生物技术快报 | 核酸适配体文库测序:核酸适配体文库测序的技术原理、实验流程与数据解析
前端·网络·数据库·人工智能·算法
Hilaku1 小时前
为什么在 2026 年,MPA(多页面应用)正在悄悄复辟?
前端·javascript·程序员
幸福小宝1 小时前
eslint和prettier
前端
anyup1 小时前
终于在今天入选了 Gitee GVP,这真值得庆祝~
前端·uni-app·开源
幸福小宝1 小时前
husky和lint-staged
前端
悟空瞎说1 小时前
iOS 高效绘图
javascript