一、目录结构
src|components|
city|
City.vue
List.vue(City.vue的子组件)
home|
Home.vue
Banner.vue(Home.vue的子组件)
store |
index.js //vuex
二、实现目标
从City.vue中的List.vue传递值到Home.vue的Banner.vue中显示(选择城市后返回Home.vue在图下方"北京"这里显示)
正常情况下传值是这样的:List.vue->City.vue->Home.vue->Banner.vue
但是这样太麻烦了,所以我们用到vuex
三、在store/index.js中
state: {
cityName:"北京"//定义一个cityName,默认值是北京
},
四、在Banner.vue中
<template><!--只放出跟本文章讨论相关的部分-->
<div