vue2.0組件之間的傳值

1.父子組件--props

props:需要注意的是，雖然的是單向的數據流，但是如果傳遞的是數組或是對象這樣的引用類型,子組件數據變化，父組件的數據通也會變化

子組件代碼

<template>
    <div>
        <p>{{msgfromfather1}}</p>
        <button @click="onClickMe">click!</button>
    </div>
</template>

 export default{
        name:"child",
        data(){
            return{

            }
        },
        props: ['msgfromfather1'],
        methods: {
//            onClickMe () {
//                console.log(this.msgfromfather1)
//            }
        }
    }
父組件代碼

<child :msgfromfather=msgfromfather></child>//動態綁定的數據
<child1 msgfromfather1="這是父組件傳遞固定內容的例子"></child1>//固定內容
2.兄弟組件或是子組件向父組件傳值--$on和$emit
a組件內容

<span class="content">我是A組件的數據->{{a}}</span>
      <input type="button" value="把A數據傳給C" @click = "send">
</div>

export default{
    data(){
        return{
            a:"我是a組件的內容"
        }
    },
    methods:{
        send(){
            this.$eventHub.$emit("a-msg", this.a);
        }
    }
}
接收內容的組件

export default{
    data(){
        return{
            a:"",
        }
    },
    created (){
        this.$eventHub.$on("a-msg", function (a) {
            this.a = a;
        }.bind(this));
    },
    methods:{

    }
}