今天是周一，记一下周六加班的笔记。
关于Vnode。有个大概的了解，链接：
https://www.jianshu.com/p/c6f53c5c8a8a
感觉vnode就是为了减少dom操作诞生的，它是个javascript对象，所以才叫虚拟dom，因为不是在dom上进行操作。
https://zhuanlan.zhihu.com/p/29220175
（这是第一次明白什么是虚拟dom)
还有一个createElement。同理。
其实我感觉vnode经常使用的时候就是在自定义指令v-的时候吧，然后自定义指令directive其实就是
当需要对普通DOM元素进行底层操作的时候用的。
像项目里的v-Permi还有v-hasRole，最后要做的也是对节点进行显示隐藏罢了。控制控件是否可见罢了。
自定义指令的操作思路就是：获取绑定的值，根据绑定的值，对节点进行操作。（万变不离其宗）
关于this.$message,它是element-ui自带的，具体message有什么属性看这个链接：
https://element.eleme.io/#/zh-CN/component/message
我感觉message最重要的属性就是type，还有duration吧。
message还可以接收vnode参数。（感觉很没有必要。。）
关于handler监听：
有两个属性，一个是immediate,如果设置为true的话，那就是说绑定了就立即执行。
一个是deep,默认值是false,如果设置为true的话，那么对象的属性发生变化了就会执行，也叫做深度执行。
链接：https://blog.****.net/Amanda_wmy/article/details/83749560
下午：
我还在看这个链接：https://juejin.cn/post/6844903478880370701
but不得不说现在代码看多了更容易看得懂了。
关于怎么看懂代码这件事。
1.大的方法包着小的方法和传给小的方法的参数，这个叫做封装，如果涉及到then，那是因为小函数会带来两种结果。
小函数便叫做异步函数。
其实，这就是一整个逻辑顺下来的。
2.new Promise在我看来就像是新建一个进程而已啊，比如你要去调用一个接口，那这个接口不可能立马拿到值，
所以你就把这个接口装进new Promise这个进程里。（promise参数就是一个函数，函数的参数又是resolve,reject）
因为这个接口被装进promise里了，所以，this.$store.dispatch里面有promise对象，那它就是通过then,catch获取值了。
同理，内部那个小写的loginByUsername有then和catch，也是因为它这个函数的内部也有promise对象，有resolve和reject
也就是说，大函数内部的小函数若是promise,也就是说有resolve,reject,那么大函数就是通过then,catch获得内部函数返回的值。
关于项目的登录方面逻辑：在登录检验成功后顺便存入token,进入下一个网页。
但是在进入下一个网页的时候，路由被拦截了。
router.beforeEach内部的重点就是next，这个路由拦截呢，是为了拉取到user_info的所有信息，
然后通过token拿到角色权限（token存在在store里了，也就是getInfo，作为store的方法，能拿到token的）
store.dispatch(‘GetInfo’).then const roles=res.data.role
(之前还不知道token跟role怎么建立关系的，现在知道了。）
登陆篇就算告一段落了。
总算是理清楚了。
总结一下，就是用户在点击登录之后，store会调用LoginByusername方法，然后通过loginbyusername接口从后端
获取到token,获取token后就可以进入下一个路由，但在进入路由的时候被拦截了，通过token去获取userinfo的信息，
通过userinfo获取到role权限，然后执行next()，即可进入下一个路由。
接下来就是权限篇
没什么可以说的吧，说一下store调用的generateRoutes方法好了（这个就是关键了解了就知道权限什么意思了），这个方法里面有一个接口方法，就是从后端拿来所有的路由。
然后下一步就是通过filterAsyncRouter进行路由过滤，这个方法可以过滤路由，生成真正的路由表，重点来了！
这个路由表最后被赋值在store里！就是这个，GenerateRoutes里的 commit(‘SET_SIDEBAR_ROUTERS’, constantRoutes.concat(sidebarRoutes))
（后续就是，state.sidebarRouters = routes，就是sidebarRouters，最后落实是通过html标签设置的！）
也就是这里 ：突然觉得好简单。。
sidebarRouters是通过…mapGetters拿到的。好奇妙。
突然发现store存token，存role，也存权限哟。因为我们这个根据role生成的路由是靠后端完成滴，所以跟案例有区别，这里方法看不到，
没关系~
所以我们项目的roles才会长这样：commit(‘SET_ROLES’, [{}]);
因为我们的项目的roles在后端，而这里store之所以写了roles，是因为框架是从别人那里借过来滴。
发现这些action方法里面还有个接口方法。大部分都是这样的，拿到接口返回的数据又进行操作变成自己想要的样子。
uu们，我终于进入下一个链接啦，https://juejin.cn/post/6844903481224986638#heading-12
这个主要是将element组件的一些问题还有解决方案。很好，速速看一遍，将来遇到可以来找。
首先是.native修饰符。一般就是用来子组件触发方法需要加.native,不然它的原生事件就会被当成普通标签的方法，就触发不了哦。
链接：https://blog.****.net/qq_29468573/article/details/80771625
用dialog来编辑，删除，新建table元素是一种很常见的业务场景。
vue的增删改查：一般增删改查都是修改数组这种，但是捏，不能直接通过索引去修改值，要多用数组的方法去修改，比如：
常见的splice,unshift,indexOf
增删改查的就是数组哦，这个数组是多个对象组成的罢了，但是也是数组嘛，一样滴哟，不要区别对待~
有一个对话框遮罩层的问题，用了克隆方面的问题，从而使得引用不一致，就不会造成值污染。
对象object用的是assign方法哟。this.objData=Object.assign({}, row) //这样就不会共用同一个对象
数组的clone用的是slice，绝啦。
突然明白v-for为什么要绑定key啦，其实很容易理解，就是当你加了key之后，那么绑定的是元素，也就是节点状态~
它知道你绑定的是哪个节点啦，链接：https://www.jianshu.com/p/4bd5e745ce95。
key值一般是从后端获取的id值~
突然想起来那个route不是有个参数query嘛，好多地方给数据设置唯一性，保证绝不跟别的一样的方法就是用new Date()捏。
相同组件不同参数，那是因为接口不同所以要写meta哟。
这就叫组件复用，大概意思就是：
当你打开组件后，点击新增，获取的是新增接口，对组件做的也是新增操作。
同理，点击编辑，获取的是编辑接口，对组件做的是编辑操作。
但是，这两个组件长一样
大家喜欢用axios请求就是因为支持promise吧！真好呀。