如何使用React -Semantic UI中的数字数组生成下拉列表 - 下拉组件?

问题描述 投票:0回答:1

我正在尝试使用React语义UI生成下拉列表 - 使用数组数组下拉。以下是我的代码:

 render() {
    const myrange = [100, 200,300,500,1000,2000,3000,5000,7500,10000,15000, 20000, 25000];

    return (
      <React.Fragment>
        <List horizontal relaxed>
          <List.Item>
            <Checkbox
              style={{ paddingLeft: "1em", paddingBottom: "1em" }}
              label={this.props.title}
              checked={this.props.checked}
              onChange={this.props.handleChange}
            />
            <List.Content>
              <Dropdown
                      placeholder="Select"
                      fluid
                      search
                      selection
                      options={myrange.map(merange => ({ label: { merange },

                    }))}
                      // onChange={this.props.handleChange("category")}
                    />

下拉列表看起来像截图:enter image description here

这段代码工作并生成一个空白列表,很高兴得到下拉列表中显示的数字...

任何帮助将在这里高度赞赏。

reactjs semantic-ui-react
1个回答
1
投票
 return (
    <React.Fragment>
    <List horizontal relaxed>
    <List.Item>
      <Checkbox
        style={{ paddingLeft: "1em", paddingBottom: "1em" }}
        label="LABEL"
        checked='checked'
        // onChange={this.props.handleChange}
     ></Checkbox>
      <List.Content>
        <Dropdown
                placeholder="Select"
                fluid
                search
                selection
                options={myrange.map(merange => ({key: merange, text:merange, value: merange }))}
              />      
            </List.Content>
          </List.Item>
       </List>
      </React.Fragment>
  )

像那样。

© www.soinside.com 2019 - 2024. All rights reserved.