vue小知识
前言
最近那个wedo项目终于快完工了,管理员的页面已经写完了,最重要的是还收获了一个np的插件和一个监控路由的小东西
开搞
1.在写完管理员的时候出现一个问题,每次修改完数据之后页面自动刷新的时候出现退出到了登录页,这个问题可真是难受。
情景:把数据存进sessionStorage
里面,再在vuex
里面存一套,在路由守卫那里用这两个判断里面存的值,如果相等就跳转,不相等就跳回到登录页面。
问题:无论刷新哪个页面,都会跳转到登录页面
解决:持久化vuex
,
方法:安装持久化插件 npm install vuex-persistedstate --save
,打开store
的index.js
,在里面添加import states from "./vuex-persistedstate"
,在Vuex.Store
里面加上plugins:[states()]
2.在写完这个东西之后,突然发现我的管理员界面中刚进去的时候空空如也,只有左边的导航栏,看着光秃秃的,这时候我就想,可以搞那个默认打开的路由啊。搞了半天放弃了,搞不定啊,但是在刚进去的时候路由是空的啊,可以经过判断路由是否变化来搞个图片啊。
情景:刚进页面的时候路由是空的,可以经过判断路由是否变化来显示一个图片,以使页面不会太单调。
思路:如果路由变化,那就把路由中的东西显示出来,如果没变,那就把图片显示出来。
解决:可以使用路由监控
方法:在页面中添加一个watch:{}
事件,用于监听路由。在里面加上"$route":"routeChange"
,这是个方法。因此在methods
中添加这个方法
watch:{
"$route" : "routeChange"
}
routeChange: function(to,from){//去哪里,从哪里来
console.log(to.path);
console.log(from.path);
//和一些自己想要的操作
}
3.在idea中用spring Initializr创建springboot项目的时候出现Default路径不能用,或者连不上网的问题。可以用阿里的地址https://start.aliyun.com/
,不得不再次赞叹阿里的强大啊!