reactjs選択されたオプションのカスタム属性を取得

Question

私は生成された選択を持っています、私は値を取得している+選択したオプションからカスタム属性を取得するために探しています。

var ServiceProviderList = React.createClass({ 
     getInitialState: function(){ 
     return { 
      service_provider_list: this.props.service_provider_list, 
      quickbooks_vendor_id: '', 
      currency: '' 
     }; 
     }, 
     handleChange: function(e){ 
     this.props.onUpdate(e); 
     }, 
     render: function(){ 
     var serviceProviderNodes = this.props.service_provider_list.map(function(item, index){ 
      return(
      <option key = {item.service_provider_id} value={item.quickbooks_vendor_id} data-currency={item.currency}>{item.company_name}</option> 
     ); 
     }, this); 
     return(
      <select value={this.props.quickbooks_vendor_id} data-currency={this.state.currency} id="quickbooks_vendor_id" name="quickbooks_vendor_id" required="required" onChange={this.handleChange}> 
      <option value=""></option> 
      {serviceProviderNodes} 
      </select> 
     ); 
     } 
    }); 

親：

... 
handleInput: function(e){ 
    this.state.invoice[e.target.id] = e.target.value; 
    this.props.onInvoiceInput(e.target.id, e.target.value); 
}, 

... 
render: function(){ 
... 
<div className="formRow"> 
    <label>Service Provider: </label><br /><ServiceProviderList id="quickbooks_vendor_id" service_provider_list={this.state.service_provider_list} onUpdate={this.handleInput} quickbooks_vendor_id={this.state.invoice.quickbooks_vendor_id} currency={this.state.invoice.currency}/> 
</div> 

handleInvoiceInput（ルート要素で）：

handleInvoiceInput: function(id, val){ 
    this.state.invoice[id] = val; 
    this.setState({invoice: this.state.invoice}); 
} 

Answer 1

あなたは使用してカスタム属性にアクセスすることができますgetAttribute('attributename')

handleInput: function(e){ 
    // e.target.getAttribute('data-currency'); will contain the selected currency. 
    this.state.invoice[e.target.id] = e.target.value; 
    this.props.onInvoiceInput(e.target.id, e.target.value); 
},