Vue3+element-plus项目开发小结（父子组件传值）

1.props父传子组件通信

在vue3中其实有几种方式可以实现父传子通信：

例如vue2延续下来的props方法，作用域插槽等等都可以实现

今天我们就介绍一下最经典的props传值；

版本迭代来到vue3项目中，换汤不换药，就是书写上需要留意一下与vue2的不同之处。

通过props传值

操作起来和vue2大差不差，首先在父组件中绑定（如果是动态需要加：）数据，实际开发中其实大部分都是动态传值；

然后vue3的值都需要const声明一下 就是给图中的pickMetaTags分配值或者函数返回式；

那么子组件如何接受呢？和vue2还是很像，只不过之前的选项式变成了api函数defineProps（需要导入的）

我这边有点不一样是因为配合了TS定义类型使用，如果是没有TS，直接写成

const props = defineProps({

pickMetaTags:String,

})

那如果页面想要用到读取到的值，直接props.（你想要的数值名）

简单俩步轻轻松松完成父子组件传值＜（＾－＾）＞