VUE.js组件通讯

VUE.js组件通讯

vue组件的运用,总是避免不了父子组件,兄弟组件之间的通讯。

父子组件通讯:

  • 在子组件中自定义组件属性。
    子组件中:props[“自定义属性名”],
    运用子组件时,<子组件名 :自定义属性名=“参数val” />
    将父组件的参数val通过自定义属性,传递给子组件。
    子组件props自定义的属性值,在子组件中无法进行修改,通过$emit(“事件名”,处理后的参数chageVal),在父组件函数中将chageVal的值赋予val
    VUE.js组件通讯
    VUE.js组件通讯
    VUE.js组件通讯
  • 兄弟组件之间的传参
    同理,通过props定义自定义参数,接受父元素传递的数据,在子组件中通过$emit();将处理的值传给子组件,然后子组件通过自定义的属性将值穿给兄弟组件。