起因:列表的table操作列需要权限控制。有权限时才展示这一列。所以判断权限,有权限时往columns数组中push一个操作列对象。
经过测试一切正常,多个页面都采用了这种方式。上预发环境后其一个页面被发现了问题。就是每次离开这个页面再回去就会多一列操作列。
问题就出在columns这个数组的位置:
- 直接放在table组件那个tsx文件中,这样没有问题。
- 放在其他文件中,但是是个方法,columns(),调用后导出一个columns数组,这样也ok。
- 放在其他文件中,直接作为一个数组,这样不行,因为是数组是引用传递。
于是使用前深克隆一下 cloneDeep(columns)。