Vue传参一箩筐(页面、组件)-创新互联

Vue页面、组件之间传参方式繁多，此处罗列出常用的几种方式，欢迎审阅补充。

这里的路由传参以编程式 router.push(...) 为例，声明式 与之类似。此处模拟情景为从 componentsA.vue 页面跳转到 componentsB.vue 页面传参。首先，路由配置信息如下：

router.js

import Vue from 'vue'
import Router from 'vue-router'

import componentsA from './components/componentsA' //在components下创建componentsA.vue
import componentsB from './components/componentsB' //在components下创建componentsB.vue
Vue.use(Router)

export default new Router({
	routes:[
		{
			path:'/componentsA',
			name:'componentsA',
			component:componentsA
		},
		{
			path:'/componentsB',
			name:'componentsB',
			component:componentsB
		}
	]
})