antd table排序会触发到分页怎么解决_多年管理系统经验总结之代码解决方案（呕心沥血之作）...

来源 | juejin.im/user/870468939940184  

作者 | 前端小月月

背景

最近的你有没有接手的新项目，对这个有什么感觉？我最近接手了一个项目，先不论是否代码行数的多少，仅是思路就很混乱，像是一件衣服在打补丁，而衣服上还有混乱的线网，数据绕来绕去，和断掉的线头，举例说明下

关于补丁

• 没有对数据进行扩展处理，一个值一个变量。例如：获取数据详情返回的多个对象，便依次存储多个对象，这样在参数变更时，便要不停地补充参数，如果你使用的是react，就会发现大量的state还没有注释它是用来干什么的，不管对于维护者，还是初入者都是不友好的，其实我们可以存储在一个变量里，在使用时直接调用对象的参数
• 列表的列表项[1，2，3，4，5]的展示，可能会根据权限展示不同的列表，刚开始是1，2，3，根据==1，==2，==3，后来变成1，2，3，4，就。。。。
• 其实我们根据业务场景是否可以传入一个数组arr=[1,2,3,4],根据includes判断是否在数组内(此处会在列表展示区做详细解释)

关于线网

• 把父级组件的静态数据number=3，和回调方法传给子类，回调方法里使用的却是，子类传回来的父类的静态数据number

关于断掉的线头

• 例如使用antd的Tabs:如果只是单纯的点击切换模块，没有进行模块的特殊处理，则不需要onChange的方法，和状态存储 ，确定我们想要的，避免无效代码

关于以上的问题，我基于以往的项目，整理了一下管理系统的组件结构思路，希望可以在你的项目开发中提供一些帮助

#概述

公共结构

关于一个管理系统，使用最多的便是增删改查，主要的逻辑是对数据的操作，基于以往的项目可以提取以下部分的公共结构

数据流向

• 搜索排序分页通过操作的参数获取，列表的展示数据
• 列表操作区会根据删除或者修改后，重新获取列表数据