记录下工作俩月内用到的一些知识

VUE篇

我是个半路出家的初级小白前端。刚步入这行两月，写这篇文章的目的是记录下自己用到的知识，以后抽时间也能回顾下。

路由相关

路由跳转

// path:'' 里面填写路由名称
this.$router.push({path:'/'}) 

// vue后退页面
this.$router.go(-1);

页面缓存 在项目中，经常会遇到请求数据之后，渲染列表。然后从列表点击进入对应详情为了返回列表时候保存记录，需要对页面做缓存处理 vue有内置的 只需要更改下 app.vue 以及 route 配置即可

app.vue 文件改成如下：

    <keep-alive>
    	<router-view v-if="$route.meta.keepAlive"></router-view>
    </keep-alive>
	  
    <router-view v-if="!$route.meta.keepAlive"></router-view>

// 以上是区分页面是否需要缓存处理 当然只是这样还不够，还需要在路由里面配置 meta

{
  path: '/',
  component: Index,
  meta: {
    keepAlive: true, // 需要缓存
  }
}
// 至此 首页完成缓存 (故名思意，有了缓存 就不会实时刷新了 ，如果需要实时刷新 就无需缓存 或者用别的触发事件来实现)

本地存储 既然是做项目，除非静态，否则都会动态的请求数据，而vue一旦进入某个页面，刷新之后数据就会消失。为此在项目中用到了本地存储

// 本地存储 localStorage 和 sessionStorage

    localStorage 可以理解为永久储存，除非手动删除 不然会一直存在

    sessionStorage 可以理解短期，随着浏览器关闭 自动清除 (我在项目中用的是这个)

// "data" 是存入名称 字符串  obj 是存入的内容 可以是数组，对象，或者字段

    sessionStorage.setItem("data", JSON.stringify(obj)); // 设置 (存入)

    var data = JSON.parse(sessionStorage.getItem('data')); // 取出

// 在使用时候 钩子函数里判断 某个值 不存在 就读取本地的值

    if( this.data == '') this.data = JSON.parse(sessionStorage.getItem('data'));

时间原因 先写这一部分，后续会把 vue打包生成app遇到的知识和细节记录下

如果有志同道合的前端伙伴 可以一起沟通下 
wx: ke1221

最后附上一个练手的小程序二维码