Есть форма, в ней некоторые поля добавляются после нажатия на

кнопку

<Input
name="team1"
onChange={this.onChange}
value={this.state.team}
/>
{
this.state.teams.map((team, index) => {
return (
<Input
name={"team" + (parseInt(index) + 2)}
key={index}
onChange={this.onChange}
value={this.state.team}
/>
)
})
}
<button
type="button"
className="btn btn-dark"
onClick={this.addTeam}
>Добавить команду</button>

В конструкторе я записал стейт

constructor() {
super();
this.state = {
name: "",
team: "",
teams: []
};

this.onChange = this.onChange.bind(this);
this.addTeam = this.addTeam.bind(this);
}

И есть функция onChange, которая записывает значение в стейт:

onChange(e) {
const { name, value } = e.target;
this.setState({
[name]: value,
});
}

Вопрос 1: по value={this.state.team} как ее делать value={this.state.team2}, value={this.state.team3} и тд?
Вопрос 2: по state, как быть с ним если я заранее не знаю какое количество team будет?

Код на гист