vue+elementUI項目，父組件向子組件傳值，子組件向父組件傳值，父子組件互相傳值。

vue+elementUI項目，父組件向子組件傳值，子組件向父組件傳值，父子組件互相傳值。html

vue 父組件與子組件相互通訊
 1、父組件給子組件傳值 props 實現父組件向子組件傳值。 1父組件裏： <child-pack  :msg ="myMsg" v-on:listenTochildEvent="showMessageFromChild"></child-pack>
msg是綁定的自定義屬性，相似咱們原生html 給標籤自定義屬性同樣，Widget是傳輸變量 <script > import childpack from './childPack.vue' //引用子組件
export default{ name: 'FatherPack', components: { childpack }, data(){ return（）{ myMsg：‘我是父組件參數’ } }, mothods:{ } } </script>
 2子組件裏： <div>
    <span>{{msg}}</span>
</div>
export default { name: 'ChildPack', props:["msg"] //也能夠指定默認類型和默認值
 // props: {
 // msg: {
 // type: Number,
  // default: 0
  // }
 // },

// isPublic: {

// type: Boolean,

// default: undefined //注意！對於布爾類型，默認值不要寫成false，不然isPublic永遠爲false。

// }

 data(){ }, created() { console.log（'child_msg',this.msg） }, mothods:{ }, } 2、子組件傳值到父組件 this.$emit() 實現子組件向父組件傳值。 1在子組件裏: export default{ methods: { changeFather(){ this.$emit("listenTochildEvent","我是子組件的參數"); }, //能夠傳遞參數，參數能夠是值、對象、數組等類型。
        // changeFather(pms){ 
        // this.$emit("listenTochildEvent",pms);
       // },
} } 2在父組件：定義事件listenTochildEvent，並實現showMessageFromChild方法，接收父組件傳遞來的參數。 <child-pack  :msg ="myMsg" v-on:listenTochildEvent="showMessageFromChild"></child-pack>
<script > import childpack from './childPack.vue' //引用子組件
export default{ name: 'FatherPack', components: { childpack }, data(){ return（）{ myMsg：‘我是父組件參數’ } }, mothods:{ showMessageFromChild(data){ console.log(data); } } </script>
 3、將1、二 一塊兒使用就是能夠實現父子組件互相傳值。

知識點：props 、$emit()vue

參考來源： https://blog.csdn.net/github_37847992/article/details/78167337

vue文檔：http://doc.vue-js.com/v2/api/#vm-emit

https://cn.vuejs.org/v2/guide/components-props.html#Prop-類型