组件传参

Posted 2020-09-26 郭磊—lily

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了组件传参相关的知识，希望对你有一定的参考价值。

一、两个平行组件传参

新建bus.js

import Vue from ‘vue‘

export var bus = new Vue()

App.vue里created方法里定义事件

import { bus } from ‘bus.js‘
// ...
created () {
  bus.$on(‘tip‘, (text) => {
    alert(text)
  })
}

Test.vue组件内调用

import { bus } from ‘bus.js‘
 // ...
bus.$emit(‘tip‘, ‘123‘)

二、子组件拿父组件数据

子组件用 props 接收

三、父组件拿子组件数据

父组件 $emit

组件 $on

以上是关于组件传参的主要内容，如果未能解决你的问题，请参考以下文章