如何使用react-select-plus获取突出显示项目的值？

Question

我正在使用react-select-plus，当我通过键盘在它们之间导航时，我正试图获得突出显示项目的值，

我该怎么做才能做到这一点？

这是我的代码示例：

class App extends Component {
  constructor() {
    super(); 
  }

  loadOptions(input, callback) {
    setTimeout(() => {
      callback(null, {
        options: [
          { value: 'one', label: 'One' },
          { value: 'two', label: 'Two' }
        ], 
        complete: true
      });
    }, 500);
  };

  render() {
    return (
      <div>
        <Async 
          loadOptions={this.loadOptions}  
        />
      </div>
    );
  }
}

希望你能帮助我

Answer 1

我终于找到了如何获得当前突出显示的项目：

class App extends Component {
  constructor() {
    super(); 
  }

  keyUp() {
    let item = ReactDOM.findDOMNode(document.getElementsByClassName('Select-option is-focused')[0]);
    console.log(item.textContent);
  }

  loadOptions(input, callback) {
    setTimeout(() => {
      callback(null, {
        options: [
          { value: 'one', label: 'One' },
          { value: 'two', label: 'Two' }
        ], 
        complete: true
      });
    }, 500);
  };

  render() {
    return (
      <div tabIndex="0" onKeyUp={this.keyUp.bind(this)}>
        <Async 
          loadOptions={this.loadOptions}  
        />
      </div>
    );
  }
}