vue的路由

本文介绍Vue中路由的基本配置项,包括path和component的使用方法,并讲解了如何通过<router-link>实现路由跳转及<router-view>展示组件。
路由常用的配置项
path:路由请求的路径
component:路径匹配成功后需要渲染的组件或者页面
 
 
 
路由跳转的方式:
1、<a href="#/home"></a>
 
2、<router-link to="/home"></router-link>
 
to的路径会与path进行匹配,如果匹配成功会渲染component对应的组件
 
组件怎样才能在页面上进行展示 必须依赖一个内置组件
<router-view></router-view> 展示路径匹配成功以后相对应的组件
/*
在vue中所以插件使用的方式
 
 
1、引入vue
2、引入插件
3、使用插件 Vue.use(插件)
 
*/
//路由的配置项
export default new Router({
//每一个路由的配置项,每一个路由都是一个对象
routes: [
{
//请求的路径 pathname
path:"/home",
//path路径匹配成功后渲染哪个组件/页面
component:Home
},
{
path:"/list",
component:List
}
]
})

转载于:https://www.cnblogs.com/tong-yao/p/10593671.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值