首页 文章

使用动态值react-redux创建一个选择

提问于
浏览 次
0

我想创建一个Select或Dropdown，其中包含一个动态来自api的列表，然后创建另一个包含该组件的组件，然后创建另一个接收从Select或Dropdown中选择的项目的按钮 .

export default class DropDown extends React.Component {
  onChange = event => this.props.onChange(event.target.value)

  render() {
    return <select {...this.props} onChange={this.onChange} />
  }
}

在这里我需要放 values 但是我必须从我的其他组件发送它们吗？

这是我的另一个组成部分

export default class DropDownWithButton extends React.Component {
  constructor(props) {
    super(props)

    this.state = {
      list: [],
    }
  }

  //don't know how to get the text from select/dropdown

  render() {
    let { name } = this.props

    let { list} = this.state

    return (
      <div>
        <DropDown
          value={Here I have to send the list?}
          className="dropdown"
          onChange={I want to get the item selected}
        />{" "}
        <MyButton
          name={name}
          surname="cucu"
          arguments={[This is the item clicked by user]}
        >
          [ Send ]
        </MyButton>{" "}
      </div>
    )
  }
}

我在我的中创建了这个DropDownWithButton

{listPlayers && <DropDownWithButton name = 我应该通过LISTPLAYERS吗？ />}

javascript reactjs redux react-redux

1 回答

  • -1

    你可以这样做：

    • 从 DropDownWithButton 组件中的API获取数据 .

    • 将它们传递给 DropDown 组件 .

    • 在 DropDownWithButton 组件中创建函数 handleChange() 并将其作为道具传递给 DropDown 组件 .

    您不需要按钮来获取数据 . 因为我们直接在组件安装中这样做 .

    CLICK ME - DEMO:

    回复于

相关问题