城市选择页面的 路由配置 跳转

，点击返回按钮可返回到首页，页面大概是这样的

打开码云，创建city-router分支

cd到文件夹 输入 git pull然后输入git checkout city-router 然后npm run dev

首先配置路由这部分的内容

打开src/router下的index.js 配置路由

第二步在pages页面新建city文件夹，新建City.vue文件

路由配好了，如何实现点击城市，实现跳转呢

首先回到header.vue 区，在城市的区域添加router-link标签，里面填写路径

现在完善city页面

在pages目录下，新建components文件夹，新建Header.vue

同时要在City.vue页面引入Header.vue

然后改变下字体

下面做返回箭头

在home.vue里添加

这里是箭头样式设置

点击返回按钮回到首页怎么做呢

回到city文件夹下的 Header.vue 给返回按按钮加一个link 路径to="/'表示根路径

别忘了给箭头添加color.

有些属性是平常要用的，例如header的行高所以在vatibles.styl定义

然后把heade.vue里的.header的行高改了

同时在home页面的header.vue里也要改一下头部的行高

然后把代码传到git仓库里

git add .

git commit -m 'city router'

git push

然后切换到主分支

git checkout master

然后让主分支融合city-router

git merge city-router

然后把主分支的内容提交到线上

git push