项目背景
一些历史原因，在项目（vue框架）中很多任务列表（超过60个）在做搜索和分页功能的时候，都没有做搜索参数（Search组件）和分页参数（List组件）的存储，这样会导致2个问题：
问题1.用户A当前搜索了xx，并选择了第二页，复制url给用户B，此时用户B打开后显示的不是A用户搜索条件的数据。
问题2.再次刷新当前列表，会将当前参数清空。这样的交互体验明显是有问题的。
所以我们想出了如下几个解决方案。
解决方案
A.将参数（搜索参数＋分页参数），存入vex中的store。
B.将参数存入本地存储，cookie，localStorage等。
C.将参数存入url
方案分析
A－存入store是项目60个列表中某些已经这样实现的，Search组件和List组件共享store中的［搜索］数据。
B－存入本地存储，每个任务列表 搜索区或分页数据改变时，将数据写入，然后对本地存储中的这些数据进行监听，做到Search组件和List组件的数据共享。
C－存入url的query参数。在任务列表中对route进行监听，从而解决上面提到的两个问题。因为存入url中，这些数据是可跨终端传递的。
应用分析
上面三种方案其实都是可行的，但是考虑到链接分享这种场景，最终我们采用方案C。
方案确定好后，问题来了，我们的列表数量非常之多。这样一个个在列表的Search组件和List组件去做url中query的写入和监听，是件异常辛苦的体力活。同时，不排除以后有什么场景或需求要继续对query做读写操作。如果在
基本实现
Decorator代码
使用此Decorator的任务列表代码
总结：
首先看采用此种方案后，后期需求迭代代码的灵活度会高很多。如果有对query变化后项目所有任务列表都需要做的事情，可以在Decorator代码的set中去做。
然后说一个对**Object.defineProperty**的小总结。这里对baseQuery的赋值，以下两个写法是有很大区别的：
1. this.baseQuery = { a : 1}
2. this.baseQuery.a = 1
因为Object.defineProperty的set是没有递归进去的。
完。
