一、父子件向子组件传值（props）

1、props

① 子组件

使用props：子组件在props中定义传值类型

② 父组件

背景: 我的项目里有很多面包屑导航的组件（from element-ui）代码量很大，但是其实只需要把每个导航栏的第二个和第三个值改变一下就好了
（我项目里的面包屑导航都只有三项）

2、插槽

vue组件组件传值方式之——插槽的分类(slot、v-slot、slot-scope)以及具体使用（附代码）

父组件向子组件传递内容

是这样：在父组件中使用了< children >< children>,我想在子组件里面传递一些内容
< children > 想传递的内容< children>
结果：加在,< children >标签中间的那些内容，就被传递到子组件的哪个区域了

• 但是！！！ 如果只是这样的话，其实也是不行的，需要在子组件上加一个slot标签，用来接收父组件传过来的内容
• 子组件可以有很多slot来接收父组件传过来的内容
  

二、子组件向父组件传值（emit）

vue组件间传值视频

1.子组件直接使用$emit将内部数据传递给父组件

this.$emit("childByValue",this.childValue);

2.父组件中接收数据

 

<template>
     <child @childByVlaue=" ByVlaue"></dhild>
</template>
methods:{
    ByValue:function(childValue){
          this.name=childValue;
     }
}

三、兄弟组件之间的传值（bus——$ emit、$ on）

① 父组件

② children子组件(emit传送)

③ brother组件（$on接收）

④ main.js

四、vuex

摘自该文的vuex部分

vuex用于组件之间的传值。

五、父组件向后代组件传值（provide、inject）

在children中定义一个子组件（grandson）

① 孩子组件

② 父亲组件（provide）

③ 孙子组件（inject）