vue路由的配置?(不用脚手架)

本文介绍了如何不使用Vue脚手架来配置Vue路由。步骤包括导入vue-router库,使用router-link组件进行页面跳转,定义要显示的组件,创建并设置路由规则,以及在根组件中注册路由器,并在页面中添加router-view标签作为路由出口。
摘要由CSDN通过智能技术生成

     <!-- 第一步:导入vue路由第三方 -->

   <script src="/vue版本/vue-router.js"></script>

 <!-- 第二步:在vue路由通过router-link组件进行页面跳转,其实对a标签的封装

                      to 属性设置要跳转组件对应的哈希值  不要加 # 号-->       

<router-link to="/home">首页</router-link>

<router-link to="/login">登录</router-link>

<router-link to="/user">用户</router-link>

 // 第三步: 添加路由跳转所对应的组件       

var Home = Vue.component("homeCom", {

            template:`<h1>这是首页</h1>`

        })

var Login = Vue.component("homeCom", {

            template:`<h1>这是登录</h1>`

        })

var User = Vue.component("homeCom", {

            template:`<h1>这是用户</h1>&
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值