找实习学习第三天

vuex实现组件之间的数据共享过程（需要先把store挂载在main。js，就和router一样）

1.store的index.js里声明vuex，创建实例new Vuex.Store  里面会有很多模块 modules ，今天要用的模块就是tab

2.tab.js中先声明state，就是要共享的数据，mutation实现具体的功能函数，mutations就是改变

collapseMenu(state){

      state.isCollapse = !state.isCollapse

对collapse取反

3.因为要在header组件中该表collapse，再button中写一个函数，调用store的commit方法就可以调用取反函数

4 侧边栏aside，再computed中接受到改变数据的消息，（因为是根据现有的值进行计算）

因为挂载了，this中有$store方法，store中有数据状态state，state中有tab中的数据 isCollapse

归纳一下：header中的按钮写个点击函数调用store中改变数值的函数，store存储改变数值的函数，aside在在store中响应接受数值改变

this.$store.commit('collapseMenu')   this.$store.state.tab.isCollapse

 

TypeError: Cannot read properties of undefined (reading ‘state‘)

不能读取到state，考虑是不是vuex的store没有挂载到main。js

 

水平垂直居中方法：

display:flex

align-item:center

justfy-content:center

 

学会看注释和文档，el-tabel-column中prop和label一直不懂，回看elementui文档发现人家就是这么定义的

prop对应键名key，label对应列名val

 

为什么实际数据是tabelData 但是写一个对照表tabelLabel，对其进行遍历就可以遍历所有数据,

更新。。。。还是没懂，神奇