vue元件之間通訊：父傳子
如果熟悉React你就會發現，vue與React的元件通訊是一樣的：父傳子、子傳父、非父子其原理是一樣的。
今天只講vue的父傳子：
子元件：
<template>
<div>
{{name}}
</div>
</template><script>
export default {
props: ['name'],
data(){
return {
}
}
}
</script><style>
</style>
父元件：<template>
<div>
<num-data :name="numData"></num-data> //屬性name前面帶冒號':',傳的是data中的值
</div>
</template><script>
import numData from './numData.vue';
export default {components: {
'num-data': numData
},
data(){
return {
numData: '84k'
}
}
}
</script><style>
</style>
子元件：
<template>
<div>
{{name}}
</div>
</template><script>
export default {
props: ['name'],
data(){
return {
}
}
}
</script><style>
</style>
父元件：<template>
<div>
<num-data name="numData"></num-data> //屬性name前面不帶冒號':',傳的值是“numData”，寫什麼就傳什麼
</div>
</template><script>
import numData from './numData.vue';
export default {components: {
'num-data': numData
},
data(){
return {
}
}
}
</script><style>
</style>