vue通信、传值的多种方式

1. 通过路由带参数进行传值

this.$router.push({ path: '/conponentsB', query: { orderId: 123 } }) // 跳转到B

this.$route.query.orderId // 在B组件拿到的参数

2. 通过设置 Session Storage缓存的形式进行传递

const orderData = { 'orderId': 123, 'price': 88 }
sessionStorage.setItem('缓存名称', JSON.stringify(orderData))
const dataB = JSON.parse(sessionStorage.getItem('缓存名称')) // 在其他组件拿到session Storage缓存的值

3. 父组件向子组件传值

// parant.vue


// 在父组件引入子组件,并把number传给子组件

// Child.vue


4. 子组件向父组件传值

// Child.vue



// parant.vue


5. 大型项目用vuex

具体怎么用vuex,可以简单大概了解下
https://www.jianshu.com/p/5f5700e9f43e

你可能感兴趣的:(vue通信、传值的多种方式)