Question

这是手动生成选项的代码。无论如何从数组或json动态填充选项

    return React.createElement("select", {},
      React.createElement("option", {value: "A"}, "Option A"),
      React.createElement("option", {value: "B"}, "Option B"),
      React.createElement("option", {value: "C"}, "Option C")
    );
  }

Answer 1

我强烈建议您编译 JSX，您可以轻松地使用 .map，其中回调返回一个组件：

const values = ['A', 'B', 'C'];
// ...
return (
  <select>
    {values.map(val => <option value={val}>{val}</option>)}
  </select>
);

如果您不能使用 JSX（尽管您真的应该在任何严肃的事情上使用，因为它使语法更容易），您可以将结果传播到 createElement 中。

return React.createElement("select", {},
  ...values.map(value => React.createElement("option", { value }, value))
);

Answer 2

const values = ['A', 'B', 'C'];
// ...
return (
  <select>
    {values.map((val, i) => <option key={i} value={val}>{val}</option>)}
  </select>
);

不要忘记添加 key prop，因为 React 会抱怨它

如何使用 React.CreateElement()

2 个答案: