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('事件名',参数)
相关推荐
颜进强2 分钟前
LangChain 从入门到实践:用最小案例理解 RAG 的 5 个核心抽象
前端·后端·ai编程
颜进强5 分钟前
MCP 从入门到实践:用 TypeScript 实现第一个 MCP Server
前端·后端·ai编程
申君健248641827720211 分钟前
MCP TypeScript SDK v2 完整升级变化说明
javascript
卤蛋fg621 分钟前
vxe-table 自定义复制粘贴逻辑:精确控制单元格数据转换
vue.js
朕的剑还未配妥21 分钟前
CSS 实现渐变毛玻璃:从 backdrop-filter 到多层 mask
前端·css
Ivanqhz27 分钟前
Rust Lazy浅析
java·javascript·rust
程序员黑豆32 分钟前
鸿蒙开发实战:使用 List 组件构建新闻列表
前端·华为·harmonyos
xiaobaoyu1 小时前
谈谈你对iframe的了解
前端
GISer_Jing1 小时前
前端转全栈须知后端知识
前端·后端·ai·前端框架
爱勇宝1 小时前
我做了一个排版器,也踩了一遍富文本复制的坑
前端·后端·微信