Как получить значение атрибута данных опции выбора в ReactJS?

Question

Я пытался различными способами получить значение атрибута данных из опции выбора. Я пробовал это, но все получается нулевым. Любая помощь оценивается.

handleChange(event) { 
    console.log("order by: ", event.target.attributes.getNamedItem('data-order')); 
} 


render() { 

    var options = []; 
    this.props.items.map((item) => { 
     options.push(<option value={item.value} key={item.label} data-order={item.order}>{item.label}</option>); 
    }); 

    return (
     <div> 
      <label>Filter Single Select</label> 
      <div> 
       <select className="form-control" onChange={this.handleChange} value={this.props.sortBy}> 
        {options} 
       </select> 
      </div> 
     </div> 
    ); 
} 

Answer 1

Ваш код не работает, потому что e.target возвращается все поле выбора, а не индивидуальный вариант. Вам нужно получить индекс выбранной опции, а затем получить доступ к этому настраиваемому атрибуту. В вашей функции изменения это будет работать:

event.target[event.target.selectedIndex].getAttribute('data-order')