发表于: 2020-05-06 21:46:49

0 1847


最近完成的事情:后台的几个页面的静态页面写完了,添加了点击效果和路由之间的页面跳转
后面的计划的事情:获取后台数据 跨域和数据可是化
遇到的问题:最近有点纠结,各种技术乱用,栅格栏用的elementui的,折叠导航栏用的bootstorpvue的,一些反法用的jqurey写的,是不是应该统一一下用一种技术去实现。。。,还有就是下面的页数使用该sess手写,还是应该用ui组件直接完成。对了师兄vuex里面应该存储哪一类的数据,哪一类的数据有不适合放在里面
收获:这个鬼东西搞了我好久,之前看bootstorpvue官方的文档,翻译的中文,后来就莫名其妙的多了这个东西,配置了跨域不行,清空的谷歌的缓存不行,配置了本地环境也不行,后来换了中方法搜索,搜的这个报错的网址,哎!居然是谷歌翻译有两个文件获取不到,大意了


把重置样式表和基础样表搬到cli里面,还是样式表好用,在assets>css新建对应的文件,把样式表的样式写进去,在main.js

引入就可以用了

//sass的重置样式表和css基础样式表
import "./assets/css/basic.scss";
//css的基础样式表
import "./assets/css/common.css";



再就是保存在vuex中的变量在F5刷新后,改变的值重置的解决方法,写在钩子函数里面,通过addEventListener是按句柄(监听函数),监听页面页面刷新,在页面刷新时,把vuex内储存的数据保存到l浏览器的sessionStorage里面,if判断浏览器内是否储存该数据,有拿出来,用replaceState修改,内部用Object.assign({} 目标对象,源对象)把源对象的值于目标对象进行合并,同名函数或变量源覆盖目标,基本上不会有易明的(仅仅在这个方法里面,有就像数组合并,易名增加对象),最后通过sessionStorage.removeItem("store")移除浏览器保存的响应式数据,避免对此赋值托速度,也利于后面要用到sessionStorage的空间。

created() {
    //在页面加载时读取sessionStorage里的状态信息
    if (sessionStorage.getItem("store")) {
      //replaceState用来修改当前历史记录实体
      this.$store.replaceState(
        //通过函数改把源对象的值赋给目标对象,重合的不同值的变量用源对象的值进行覆盖
        Object.assign(
          {},
          this.$store.state,  // 目标对象
          JSON.parse(sessionStorage.getItem("store")) //源对象
        )
      );
      sessionStorage.removeItem("store");
    }

    //用事件句柄监听,在页面刷新时将vuex里的信息保存到sessionStorage里
    window.addEventListener("beforeunload", () => {
      sessionStorage.setItem("store"JSON.stringify(this.$store.state));
    });



返回列表 返回列表
评论

    分享到