一文带你读懂vue路由-创新互联
本篇文章给大家分享的是有关一文带你读懂vue路由,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。
创新互联专注于企业全网营销推广、网站重做改版、华龙网站定制设计、自适应品牌网站建设、H5建站、商城网站开发、集团公司官网建设、外贸网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为华龙等各大城市提供网站开发制作服务。前端路由和后端路由:
- 后端路由:对于普通的网站,所有的超链接都是url地址,所有url都对应服务器上对应的资源
- 前端路由:对于单页面应用程序来说,主要通过url的hash(#)来实现不同页面的切换,同时hash还有一个特点HTTP请求中不会包含hash相关的内容,所以单页面程序中的页面跳转主要用hash实现
在单页面应用程序中这种通过hash来改变页面的方式称作前端路由区别于后端路由
路由的使用
1.创建一个路由对象,当导入vue-router包之后,在window全局对象中就有一个路由的构造函数VueRouter
2.在new路由对象的时候可以传递一个配置对象,这个配置对象的route表示路由器的匹配规则
3.每个路由规则都是一个对象,这个规则对象身上必须有两个属性
- 属性1 path表示监听哪个路由链接地址
- 属性2 component,表示如果路由是前面匹配到的path,则展示component属性对应的组件,component属性值必须是一个组件模板对象,不能是组件的引用名称
var login={ template:'登录
' } var register={ template:'注册
' } var routerObj=new VueRouter({ routes:[ {path:'/login',component:login}, {path:'/register',component:register} ] })
网页名称:一文带你读懂vue路由-创新互联
URL网址:http://abwzjs.com/article/cccsjh.html