vue3|vue3 父子组件传值详解
现在距离vue3的诞生已经过了很长时间了，笔者也是近期才开始学习vue3。对比vue2来看，vue3在写法发生了不小的变化，最典型的例子就是vue3通过ref，或者reactive实现数据的响应式。因为ref和reactive的出现，使得vue3中父子组件的传值方式也发生了变化
咱们先看下vue2中的写法
父组件：
子组件说： {{ childrenAsk }}
子组件：
父组件传过来的值： {{ title }}
在vue2中，子组件向父组件传值通过this.$emit的形式实现，但是vue3中，是不存在this的，vue3中将数据和函数都封装在了setup中，那么vue3是怎么实现的呢？
我们知道vue3中的setup接收两个参数，第一个参数是props，即父组件向子组件传递的props值，第二个值为context，这个值代表了当前的上下文对象，知道这个东西以后现在来实现vue3的父子组件传值
vue3中父传子和vue2中的父传子一样，再次不做过多阐述，下面重点关注的是vue3的子传父
父组件
父组件子组件对我说：{{ children_msg }}{{ value }}
子组件：
子组件父组件传过来的值为：{{ title }}
总结
【vue3|vue3 父子组件传值详解】本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容!
推荐阅读
- 动态组件与v-once指令
- vue组件中为何data必须是一个函数（）
- (六)Component初识组件
- Spring|Spring Boot 自动配置的原理、核心注解以及利用自动配置实现了自定义 Starter 组件
- vuex|vuex 基础结构
- SwiftUI|SwiftUI iOS 瀑布流组件之仿CollectionView不规则图文混合(教程含源码)
- Vue组件之事件总线和消息发布订阅详解
- vue.js组件开发
- TCP组件设计篇（详细设计）
- Spring注解05|Spring注解05 @Import 给容器快速导入一个组件