使用material-ui,我试图迭代一个数组并将一个项值呈现为选项卡。我想按照此示例https://material-ui.com/utils/transitions/#grow使标签页在加载时增加。
我能够有效地进行迭代并按如下所示显示选项卡;
<Tabs fullWidth value={value} onChange={this.handleChange} scrollable>
{this.props.myArray.map((p, i) =>
<Tab value={p.value} label={`${p.value}`}/>)}
</Tabs>
逻辑方法是;
<Tabs fullWidth value={value} onChange={this.handleChange} scrollable>
{this.props.myArray.map((p, i) =>
<Grow in={true} timeout={500}
<Tab value={p.value} label={`${p.value}`}/>
</Grow>)}
</Tabs>
但是这不起作用,“ p”变得不可访问,并且不应用“增长”效果。
我最好的选择是使用Tab源并创建自己的组件来实现此处https://reactcommunity.org/react-transition-group/transition所述的转换吗? 我很高兴这样做,但是如果有一个简单的解决方案,显然会更喜欢上面的方法。
谢谢!