React-bootstrap jak uchwycić wartość listy rozwijanej

Question

zorientowali się, jak korzystać reagowania-bootstrap aby wyświetlić listę rozwijaną:

<DropdownButton bsStyle="success" title="Choose" onSelect={this.handleSelect} > 
    <MenuItem key="1">Action</MenuItem> 
    <MenuItem key="2">Another action</MenuItem> 
    <MenuItem key="3">Something else here</MenuItem> 
</DropdownButton> 

Ale jak jestem przypuszczać, aby napisać procedurę obsługi dla onSelect uchwycić wybrana opcja? Próbowałem tego, ale nie wiem, co napisać w środku:

handleSelect: function() { 
    // what am I suppose to write in there to get the value? 
}, 

Ponadto istnieje sposób, aby ustawić opcję, która zostanie wybrana domyślnie?

Dziękujemy!

Answer 1

Funkcja onSelect przepuszcza wybraną wartość

<DropdownButton title='Dropdowna' onSelect={function(evt){console.log(evt)}}> 
    <MenuItem eventKey='abc'>Dropdown link</MenuItem> 
    <MenuItem eventKey={['a', 'b']}>Dropdown link</MenuItem> 
</DropdownButton> 

W tym przypadku, jeśli wybierzesz pierwszą opcję, „abc” jest drukowany, w drugim wariancie można zobaczyć obiekt może być przekazywane w także.

Więc w kodzie

handleSelect: function (evt) { 
    // what am I suppose to write in there to get the value? 
    console.log(evt) 
}, 

Nie jestem pewien co masz na myśli przez wartość domyślną, ponieważ nie jest to select - tekst przycisk jest to, co jest w atrybucie tytułowym. Jeśli chcesz obsłużyć wartość domyślną, możesz ustawić wartość, gdy wartość wynosi null.

Answer 2

zapomniałeś wspomnieć, że eventKey jest przekazywana jako drugi parametr, jest to poprawna forma, aby uzyskać wartość co kliknąłeś:

handleSelect: function (evt,evtKey) { 
    // what am I suppose to write in there to get the value? 
    console.log(evtKey) 
}, 

Answer 3

może chcesz użyć FormControl >> wybierz komponent Twój przypadek:

<FormControl componentClass="select" placeholder="select"> 
     <option value="select">select</option> 
     <option value="other">...</option> 
    </FormControl>