介于前几天一直在看他们的代码，写css，我已经异常的烦躁了。过完端午假期，新的一星期开始了，leader给我安排了新的任务。
- 封装可缓存的table组件（这是因为目前他们的table，分页选中切换页面之后，旧的选中无了）
- 封装滚动组件（滚动到最下面，请求数据）
- 改代码
但是这是一个月的任务= =。
今天我就直接着手于封装table组件了，因为这个table组件是基于公司内部组件库的一个已经封装好的组件的（暂且叫做组件A），我只需要添加一个缓存并回显的功能即可，其余的attrs和监听的listeners都照样传递给组件A即可。插槽的话通过v-for定义，并且动态插槽名等方法来定义（因为会传入每个插槽的信息字段）
不得不说，v-bind="$attrs" 和 v-on="$listeners"是真的好用。感觉封装后的效果跟react的HOC高阶组件好相似（不知道是不是我的错觉），就是在封装的组件中缓存数据，并且绑定到组件实例上方便获取即可。
其实有了思路之后就不难，但是为了性能考虑，我的做法是将每一页的数据存到map中，这个map是以currentPage为key，选中的行的数据数组作为value的对象。当选择事件触发时，我只 通过emit传递当页的数据而不是全部数据。
另外一点比较坑的是，他们的数据不是放在vuex或者pinia中的，而是在页面里即时获取的，也就是说切换currentPage时会请求数据，导致从页面1到页面2再到页面1时，虽然数据结构和内容没变，但是作为对象，我保存的是对象的内存地址，返回的数据的对象又是新的内存地址，这就导致在回显数据时比较困难（因为组件A底层是通过indexOf来判断的）。
我的解决办法是，只能通过旧的缓存下来的数据的唯一id去过滤出新的数据的每个对象（不得不说如果页面大的话，这将是一个混浪费性能的办法，毕竟是On2的复杂度）
但是至少也完成了这个功能，还是值得庆祝的~
加油冲！
