持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第6天，点击查看活动详情juejin.cn/post/714765…
- 今天写项目的时候，写到了角色管理。
- 主要用到了
antd的Card组件和Tree组件，最开始的时候，所有人的数据都是自己向服务器发送请求回来的，并渲染到表格中。 - 最初始的时候，
创建角色部分是可操作的，而设置角色权限部分是disabled的，当点击了某一个人的信息的时候，就去掉disabled属性，会弹一个Card组件，Card组件中包含了Tree组件，给大家上图看一下：
下面的图是弹框
- 最初始打开的时候，首页是被勾选了的，当想要进行修改权限时，发现修改不了，原来是我在设置
<Tree/>组件的时候，把checkedKeys={role.menus}的属性设置成了固定的值，这个值是我从服务器请求回来的menus属性，正常应该是把它设置成动态的。 - 上面的Tree内容是通过递归函数渲染出来的，以前不太会用递归函数，但是用了以后感觉真香，但是现在用起来有时候也没有思路，觉得很难。给大家看一下我写的递归：
- 具体是怎么解决的，给大家上代码：
在
<Tree/>组件里有一个onCheck事件，该事件是在当我们选中radio（就是上面第一张图的单选按钮）的时候调用的函数，把该事件也给大家上图：
该函数接收两个参数，第一个参数所有
menus的集合，在该函数体里更新checkdKeys的状态，使组件重新渲染。所以在最终的时候<Tree/>组件的checkedKeys={role.menus}属性应该改写成checkedKeys={checkedKeys}，因为单选按钮被默认选中就是根据checkedKeys属性进行设置的。
我写的不太好，如果大家有更好的一些解决方法，可以留言哦！！！
