javascript - ANT JS 选择不显示值 reactjs

Question

我是新手。我需要在我的网页中进行选择。我有一个看起来像这样的数组，

databaseList =  ["information_schema", "ResumeParser", "analystor", "analystor_check", "mysql", "performance_schema", "plugin_testing", "sys", "wordpress"]

我想将这个数组映射到Select。
在 HTML 中的普通 Select 中，它可以工作，这是代码，

<select >
    <option value='None'>None</option>
    {
        this.state.databaseList.map((database) => {
            return (<option value={database}>{database}</option>)
        })
    }
</select>

但是在Ant JS select中，显示错误，这是 Ant js 代码，

<Select mode="single" placeholder="Please select Database" style={{ width: '370px' }}>
    {
        this.state.databaseList.map((database) => {
            return (
                <Option value ={database}>
                    {database}
                </Option>)
        })
    }
</Select>

我得到的错误:

我不知道我在 AntJS 选择中做错了什么。我浏览了 Ant JS 文档，但无法解决我的问题。帮我解决一些问题。

Answer 1

您的代码应该可以工作，唯一的问题是 databaseList 可能是 undefined。

class App extends React.Component {
  state = {
    databaseList: [
      'information_schema',
      'ResumeParser',
      'analystor',
      'analystor_check',
      'mysql',
      'performance_schema',
      'plugin_testing',
      'sys',
      'wordpress'
    ]
  };

  render = () => {
    return (
      <Select
        mode="single"
        placeholder="Please select Database"
        style={{ width: '370px' }}
      >
        {Array.isArray(this.state.databaseList) &&
          this.state.databaseList.map(database => {
            return <Option value={database}>{database}</Option>;
          })}
      </Select>
    );
  };
}