Question

我有一个包含npm包的React应用程序：

<script>
    $('.message').hide();

    $('.vote').click(function(e){

        e.preventDefault();

        var element = this; 
        var id = $(element).closest('span').data('id');

        alert(id);

    });
 </script>

我的Select2组件如下所示：

import Select2 from 'react-select2-wrapper';

我想点击一个按钮，让它更改Select2组件的选定值 - 我该怎么做？

Answer 1

react-select2-wrapper有value属性

var Select = React.createClass({
  getInitialState() {
    return { value: null }
  },

  handleClick(value) {
    this.setState({ value });
  },

  executeSelectedOption() {},

  render() {
    return <div>
      <p>
        <button onClick={ this.handleClick.bind(this, '') }>Select Empty</button>  
        <button onClick={ this.handleClick.bind(this, 'edit') }>Select Edit</button>
        <button onClick={ this.handleClick.bind(this, 'duplicate') }>Select Duplicate</button>
      </p>

      <Select2
        value={ this.state.value }

        options={{
          minimumResultsForSearch: Infinity
        }}

        data={[
          { text: '...', id: "" },
          { text: 'Edit', id: "edit" },
          { text: 'Duplicate', id: "duplicate" }
        ]}
        onChange={this.executeSelectedOption.bind(this)}
       />
    </div>
  }
});

Example

如何在React中设置Select2组件的选定状态？

1 个答案: