多个页面相似，复用一个页面

之前接到的一个需求

公司的系统里边需要对四个不同的模块都新增一个统计页面

这个页面就跟我们常见的后台管理系统里的列表页一模一样

基本结构都是

　　搜索条件

　　查询按钮

　　数据列表

　　分页组件

通过观察四个页面原型，发现只有搜索条件和数据列表表头不一样

于是想到了通过动态渲染搜索条件和数据列表表头

所以写了四组数据，具体代码很简单，根据不同的路由去判断显示哪一组数据，我这边也是接口方法也写到了四组数据里边

后来经过测试发现一些问题

问题1 因为我是直接用的一个页面，四个路由都是指向了同一个vue文件，所以这四个页面来回切换的时候，页面并不能意识到路由变了，所以在watch里边监听了一下￥$route这个属性，另外就是一些数据的初始化了

问题2 因为是四个页面，四个模块，所以是和四个后端去联调，，他们给出了不同的数据结构，接口的入参也不同，用了很多的if判断，这个问题不知道怎么去解决，个人认为这些判断可以用更简洁的方式去处理，或者我这四个模块的页面从一开始就不对劲，就不应该都指向同一个vue,但因为做完了就没管，后期维护的话，成本应该较高。