在 React JSX 中动态更改 .map 中的输入名称

Question

{this.props.items.map((item, idx) => (
<input type="text" name="name{idx}" ... />
))}

有没有办法动态更改输入的名称，例如：

name="name0"
name="name1"
name="name2"
...

我试过了name="name{idx}"; name="name"{idx}; name="name"+{idx}; name="name".{idx}; ...

Answer 1

使用这个：

<input type="text" name = {`name${idx}`} ... />

name${id} : 这种方式叫做template literals，检查mozilla doc.

或者你也可以使用+来写：

<input type="text" name = {"name" + idx} ... />

Dynamically change input's name in .map inside React JSX