从下拉列表中选择一个项目,并在React ES6中的另一个组件中使用该值

时间:2018-06-18 10:43:13

标签: reactjs

我是React技术的初学者,在这里我试图从下拉列表中选择一个语言值,并希望在另一个组件中使用该值。有人可以帮助我吗?

export default class Language extends Component {
    constructor(props) {
        super(props);
        this.state = {value:'se'};
        this.handleChange = this.handleChange.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
      }

      handleChange(event) {
        this.setState({value: event.target.value});
      }

      handleSubmit(event) {

        alert('Language selected is: ' + this.state.value);
        event.preventDefault();
      }
      renderSelectOptions (item){ 
        <option key={item} value={item}>{item}</option>
        alert('hii' + item);
      }
    render () {
      return (
        <div>
             <select value={this.state.value} onChange={this.handleChange}>
             {this.props.value(this.renderSelectOptions)}
              <option itemText="Swedish" value="se">Swedish</option>
              <option itemText="English" value="en">English</option>
              <option itemText="French" value="fr">French</option>
          </select>
          </div>
      )
    }
  }

0 个答案:

没有答案