Vue中传参的方法

161 阅读1分钟

父子组件之间传参

  • 父组件使用v-bind绑定属性,子组件通过props拿到值

非父子组件之间传参

  • 使用动态路由传参

通用传参

  • 使用vuex传参

公交bus

创建一个bus.js文件

// bus.js
import vue from 'Vue'
export default new Vue()

在传出数据的组件中

import bus from '.../bus.js'
...
methods: {
	set () {
    	bus.$emit('change-value', this.value)
    }
}
...

在接受数据的组件中

import bus from '.../bus.js'
...
methods: {
	get () {
    	bus.$on('change-value', function (value){
        	this.value = value
        })
    }
}
...