Reagieren Sie kann nicht von den auserwählten mehr Form wähle

Question

So mache ich eine select multiple Form in React.js, doch jedes Mal, Optionen erzeugt werden, kann ich nicht die Optionen auswählen. Wenn ich auf eine Option klicken, ist es sofort nicht hervorgehoben und nicht ausgewählt.

React.DOM.div({ 
    className: 'form-group' 
}, React.DOM.select({ 
    multiple: true, 
    name: 'team_players', 
    value: this.state.team_players, 
    onChange: this.handleArrayChange 
}, React.DOM.option({ 
    value: '', 
    disabled: true 
}, 'Select Players'), (function() { 
    var i, len, ref, results; 
    ref = this.state.players; 
    results = []; 
    for (i = 0, len = ref.length; i < len; i++) { 
     player = ref[i]; 
     results.push(React.DOM.option({ 
     key: player.id, 
     value: player.detail.inputs["NAME"] 
    }, player.detail.inputs["NAME"])); 
} 
return results; 
}).call(this))); 

* Bitte beachten Sie, dass dies die durch js2.coffee von meinem Coffeescript-Version erzeugt js-Version ist, die als solche geht: *

React.DOM.div 
className: 'form-group' 
React.DOM.select 
    multiple: true 
    name: 'team_players' 
    value: @state.team_players 
    onChange: @handleArrayChange 
    React.DOM.option 
    value: '' 
    disabled: true 
    'Select Players' 
    for player in @state.players 
     React.DOM.option 
     key: player.id 
     value: player.detail.inputs["NAME"] 
     player.detail.inputs["NAME"] 

Meine handleArrayChange Funktion geht als solche:

({ 
handleArrayChange: function(e) { 
    var i, len, name, obj, option, options, team_array; 
    options = e.target.options; 
    name = e.target.name; 
    team_array = []; 
    for (i = 0, len = options.length; i < len; i++) { 
    option = options[i]; 
    team_array.push(option); 
    } 
    return this.setState((
    obj = {}, 
    obj["" + name] = team_array, 
    obj 
)); 
} 
}); 

und in seiner Form Coffeescript:

handleArraychange: (e) -> 
    options = e.target.options 
    name = e.target.name 
    team_array = [] 
    for option in options 
    team_array.push option 
    @setState "#{name}": team_array 

Warum dieses Formular nicht meine Eingaben richtig behandeln?

Answer 1

Sie setzen den team_array-Status als ein Array von Option HTML-Elemente, kein Array von Zeichenfolgen. Versuchen Sie dies stattdessen: