vue-cli2脚手架:router实现页面跳转

接下来,我们要实现在首页,可以通过链接进入a,b两个“页面”,与此同时,在还可以返回首页。

创建A.vue和B.vue两个页面:
vue-cli2脚手架:router实现页面跳转_第1张图片
修改index.js页面:
vue-cli2脚手架:router实现页面跳转_第2张图片
修改A.vue和B.vue:
在这里插入图片描述

<template>
    <div>
        <p>我是B...</p>
        <p><router-link to="/">返回</router-link></p>
    </div>
</template>

浏览器测试:
vue-cli2脚手架:router实现页面跳转_第3张图片
vue-cli2脚手架:router实现页面跳转_第4张图片
到这里就完成了简单的页面跳转。

你可能感兴趣的:(前端开发,Vue,vue.js,前端)