我想创建一个页面,首先包含3行用户输入。看起来像
电子邮件角色组
[文本输入] [下拉列表] [下拉列表]
[文本输入] [下拉列表] [下拉列表]
[文本输入] [下拉列表] [下拉列表]
其中,文本输入将是用户添加电子邮件的输入字段。下拉列表只是一个下拉块
我想创建一个可以添加另一行的按钮。到目前为止,每一行都位于NewUser
组件中,该组件看起来像
<div className='new-user'>
<label className="email-input">
<input type="text" name="email"/>
</label>
<Dropdown className='dropdown' options={roles} onChange={this._onSelect} value={defaultRoleOption} placeholder="Select a role"/>
<Dropdown className='dropdown' options={groups} onChange={this._onSelect} value={defaultGroupOption} placeholder="Select a group"/>
</div>
roles
和groups
是数组
我不知道什么是最好的方法。我可以创建一个rowNum
并将其存储在state
中,然后每次单击按钮时,该数字都会递增,但是我不知道如何根据此填充行数数字。
或者也许有更好的方法可以做到这一点?
答案 0 :(得分:0)
没关系,我明白了。
let rowNum=3;
let newUserList = [];
for (let i=0; i<this.state.rowNum; i++) {
newUserList.push(<NewUser roles={this.state.roles} datasets={this.state.datasets}/>);
}
return (
<div>
{newUserList}
</div>
);
这有效。但这与使用map
相比没有效率吗?