react父组件怎么控制子组件中的项目

Question

老师，我这是自己仿的一个项目。上面这个功能我有个疑问左边栏三个切换和右边栏的上面的切换项用的都是同一个antd里的tags组件，我把tags单独写在一个组件中，通过父组件传tag和key，现在遇到一个问题就是右边这些表单我也是单独写在组件中，但是左边3个切换，右边都是4个切换，这样就要调用12次表单的组件，有没有什么简便的方法可以解决这个问题，我刚开始想用vue里插槽的思想解决，但是react里子组件中props.children无法获取表单这个组件

Answer 1

阿莱克斯刘 2022-03-01 15:21:10

其实我挺好奇你是如何通过tag组件来切换页面的，想了很久似乎也没有找到如何通过tag来切换多重页面的思路。不过，似乎也没有特别好的思路，我目前唯一能想到的就是用横竖tab组件制作二维结构。也就是竖向tab嵌套横向tab。或许12个表单无法避免，但是可以考虑把表单的主要功能封装一下，做一个共有组件来调用（不过，如果每个页面的变化太大就没必要了）。

• 提问者 厉伊 #1

  我现在是把表单封装起来了，然后tag组件封装起来，在调用tag的组件中通过传递表单在props.children里可以达到父组件去规定子组件展示的内容