我的博客

在某些情况下，当路由跳转前或跳转后、进入、离开某一个路由前、后，需要做某些操作，就可以使用路由钩子来监听路由的变化1.全局路由钩子router.beforeEach 注册一个全局前置守卫router.beforeEach((to, from, next) => { //会在任意路由跳转前执行，next一定要记着执行，不然路由不能跳转了 console.log('beforeEach') console.log(to,from) next()...

为了更好的用户体验，需要在用户访问某个路由的时候，如果匹配不上就跳转到另外一个页面。也就是通常所见的404页面。方式一：在路由的匹配规则最后加入*，必须放在最后const routes = [ {path:'/',redirect:'/home'}, { path: '/home', name: 'Home', component: Home }, { path: '/about', name: 'About', componen

什么是路由1.后端路由：对于普通的网站，所有的超链接都是url地址，所有的url地址都对应服务器上对应的资源2.前端路由：对于单页面应用程序，主要通过url中的hash(#号)来实现不同页面之间的切换hash的特点：HTTP请求中不会包括hash相关的内容在单页面应用程序中，通过hash来切换页面的方式，叫做前端路由...

1.导入vue-router.js包2.使用路由构造函数VueRouter创建路由规则对象var routerobj=newVueRouter({//route//表示【路由匹配规则】routes:[//每个路由规则都是一个对象，这个对象必须有两个属性//属性1是path，表示监听哪个路由...

路由redirect的使用：当根路径页面为空时，需要默认显示某一个组件，例如登录注册界面默认显示login，需要重定向根路径为/loginvarrouterobj=newVueRouter({routes:[ {path:'/',redirect:'/login'}, 根路径/重定向为/login {path:'/login'...

方式一：使用query方式传参1.在url后面用?的方式传入参数<router-linkto='/login?id=10&name=alan'>登录</router-link>2.调用时直接在组件模板中{{$route.query.id}}template:'<h3>登录组件---{{$route.query.id}}---{{$...

1.创建父路由 <router-linkto='/account'>Account</router-link><router-view></router-view>2.在父路由模板里加入子路由<templateid="tmp1"><div><h1&...

1.设定好三个模板varheaderBox={template:'<h1class="header">头部区域</h1>'}varleftBox={ template:'<h1class="left">左侧区域</h1>'}varmainBox={template:'<h...

watch监听data中数据变化watch属性监听data中指定数据的变化，来触发对应处理函数注意:newVal是数据变动后的值，oldVal是数据变动前的值varvm=newVue({el:'#app',data:{firstname:'',lastname:'',fullname:'...