Vue脚手架中页面跳转

1.进入index.js(路由)页面
刚刚进入页面时

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'


Vue.use(Router)

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

添加import arr from '@/components/arr'（arr代表你要用的页面名字）在import HelloWorld from '@/components/HelloWorld的下方。
在routes中给arr注册

  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path: '/arr',
      name: 'arr',
      component: arr
    }
  ]

2.回到你要实现跳转事件的页面(我这里是回到HelloWorld.vue中)
在methods中添加一个事件

methods：{
tiaozhuan: function() {
      this.$router.push({ path: "/arr" });
       }
    }

将事件绑定在你的按钮中

确认

在页面点击确认即可成功跳转（从HelloWorld.vue跳转到arr.vue）

运行效果图

对地址选择器感兴趣可以查看我的博客Vue脚手架中运用Vant-ui省市区选择器中查看
或者去Vant中查看关于地址选择器的代码AddressEdit 地址编辑