Vue组件传参的五种方式

Vue组件传参的五种方式

方法一 props传参

父组件



子组件



方法二 事件传递

父组件




子组件




方法三 事件监听

父组件




子组件




方法四 消息发布与订阅

安装 pubsub-js 插件: npm i pubsub-js -s 可实现全局参数传递
组件A




组件B




  • publishSync
    同步发送消息
  • publish
    同步发送消息
  • subscribe
    订阅消息
  • unsubscribe
    卸载特定订阅
  • clearAllSubscriptions
    清除所有订阅

方法五 EventBus传参

1.在main.js种挂载全局EventBus

Vue.prototype.$EventBus = new Vue()

2.A组件




3.B组件




通过挂载全局Vue对象传递参数。

你可能感兴趣的:(Vue组件传参的五种方式)