先介绍一下Props
与$emit
的功用
Props
:父层若要将内容传递进去子层元件就需要用到props
这个属性。
再命名上需要注意的是:
子层Props
使用驼峰式命名的话,外层则必须使用 - 的符号来做命名
举例来说:
父层的属性名称 :item-data = "msg"
则子层的属性名称必须为驼峰式命名 props:[itemData]
<div id="app"> <my-component :item-data = "msg"></my-component></div>Vue.component('my-component', {template: `<div> any do something</div>`,props: ['itemData']})
$emit:
当子层元件要将资料传递到父层时,就需要使用$emit
这个属性来传递。
但今天的重点并不是要介绍Props
,而是要介绍$emit
废话不多说,我就直接上图了
看完图片的说明后有没有更加了解了一些呢?
虽然说这只是基本的题型,但有进步就好
结论就是口诀背单字:props in
, $emit out