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('事件名',参数)
相关推荐
大孜然5 分钟前
孜然QQ频道自动化程序机器人配置教程
前端
用户469384921556 分钟前
AIUI 焦点高亮切换失效排查与规避:为什么按钮不变换形态呢?
前端
派大鑫wink14 分钟前
纯前端实现软考中级·软件设计师备考学习网站
前端·学习
kyriewen25 分钟前
我扒了 npm 三年数据:AI 没把依赖变胖,是把包变多了
前端·人工智能·程序员
SensorFlow43 分钟前
曝光埋点别放在组件渲染里:连续可见与去重范围怎么验收
javascript
harris148154352975843 分钟前
能解码不等于能信任:JWT 的签名到底验的是什么
javascript
liqingdi43743 分钟前
[SWPUCTF 2023 秋季新生赛]Easy SMC
服务器·前端·javascript
用户87359865635871 小时前
为什么 greedy 也可能出不同 token,MoE 为什么更严重
前端
日耗10亿Token被老板赶出门1 小时前
REA 火了:一个 Electron 按钮的调用链,它能追到哪一步?
javascript·electron
Gizzap_Tech1 小时前
多语言官网如何兼顾统一与本地化?从页面生成到语言切换
前端