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: [{...
·
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" });
}
}
将事件绑定在你的按钮中
<p @click="tiaozhuan">确认</p>
在页面点击确认即可成功跳转(从HelloWorld.vue跳转到arr.vue)
运行效果图
对地址选择器感兴趣可以查看我的博客Vue脚手架中运用Vant-ui省市区选择器中查看
或者去Vant中查看关于地址选择器的代码AddressEdit 地址编辑
更多推荐
已为社区贡献2条内容
所有评论(0)