陣營，引導如何捕獲下拉列表的值

我想通了如何使用做出反應，引導顯示一個下拉列表：陣營，引導如何捕獲下拉列表的值

<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>

，不過爲什麼我猜想寫的處理程序ONSELECT捕捉選項被選中？我試過，但不知道在裏面寫什麼：

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

另外，有沒有辦法設置默認選擇的選項？

謝謝！

來源

2015-07-20 Cheng

的onSelect函數傳遞所選擇的值

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

在這種情況下，如果選擇了第一選項，「ABC」被印刷，在第二個選項你可以看到一個對象可以被傳遞以及。

因此，在你的代碼

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

我不知道你所說的默認值是什麼意思，因爲這不是一個選擇 - 按鈕上的文字是無論是在title屬性。如果你想處理一個默認值，你可以設置一個值，當值爲null。

來源

2015-07-20 06:57:58 noveyak

太棒了，謝謝！讓我澄清我的第二個問題。我的下拉列表中有三個選項。我想要默認選擇第一個選項。什麼是完成這個的正確方法？再次感謝！哦，還有，你在哪裏找到關於'eventKey'的文檔？我確實看過react-bootstrap的網站，找不到它... – Cheng

嗯，我認爲問題是這些菜單項。期望是當用戶從下拉列表中選擇一些東西時應該發生的事情。它沒有當前值的概念。如果您嘗試使用像元素這樣的表單，用戶可以選擇一個選項然後繼續，則可能需要查看 – noveyak

我注意到一個奇怪的問題。 ''然後，在'handleSelect'中，我編寫了'this.setState（{value：index}）; console。 log（this.state.value）;'當我讀取控制檯輸出時，該值似乎滯後。意思是，當我第一次選擇一個項目。控制檯會輸出狀態變量的默認值。如果我選擇另一個項目，控制檯會輸出我之前選擇的值。你知道爲什麼發生這種情況嗎？ – Cheng

你忘了提，eventKey作爲第二參數傳遞，這是正確的形式，以獲得您點擊一下值：

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

來源

2016-06-09 04:48:19 dizquierdo

您可能需要使用FormControl >>的選擇組件你的情況：

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

來源

2017-01-29 02:27:10 Farax

陣營，引導如何捕獲下拉列表的值

回答

相關問題