無法獲得輸入選擇表單的初始值

我正在使用react-select作爲我的輸入字段。除了在點擊後在輸入內獲取選定值之外，一切都可以正常工作。另外（正如標題中提到的），雖然在代碼中設置了，但我無法看到在選擇字段中彈出的初始值。無法獲得輸入選擇表單的初始值

render(){ 
    var Select = require('react-select'); 
    var options = [ 
     { value: '1', label: '1' }, 
     { value: '2', label: '2' } 
    ]; 

    function logChange(val) { 
     console.log(val); 
    } 
    return(

     <Select 
      name="form-field-name" 
      value="one" 
      options={options} 
      onChange={logChange} 
     /> 

    );

所有的事件工作正常（我可以看到，然後在我的console.log但沒有任何改變在屏幕上）。

這裏是的console.log和渲染（null是因爲X圖標清晰的）

來源

2017-03-17 eugene_sunic

你忘了添加此關鍵字'的onChange = {this.logChange}'。進一步看看這個例子https://github.com/JedWatson/react-select/blob/master/examples/src/components/States.js – DroidNoob

，只是惡化的東西...沒有必要...沒有任何顯示當添加這個前綴時，在控制檯中啓動 –

閱讀源代碼之後，我敢肯定你是路過的錯誤的價值進入value道具。

expandValue試圖找到在options prop內傳遞的值（從value prop），如果失敗則返回undefined。

for (var i = 0; i < options.length; i++) { 
    if (options[i][valueKey] === value) return options[i]; 
}

你傳入一個字符串「一個」，這是不存在於你的選擇陣列。

options[i][valueKey]你的情況可能是字符串「1」或「2」。 valueKey === 'value'，所以這是從你的選項的對象值屬性中檢索的（你在標籤內有相同的值，所以我想強調一下，因爲它可能會令人困惑）。

更改值應該做的伎倆

<Select 
    name="form-field-name" 
    value="1" 
    options={options} 
    onChange={logChange} />

回答您的評論的問題：我不知道，但這個貌似控制輸入給我。您的選擇值位於hidden input之內，該值使用value prop中的值。我認爲你必須做這樣的事情：

class MySelect extends React.Component { 

    constructor(props) { 
     super(props) 

     this.state = { 
      value: "1" 
     } 

     this.handleChange.bind(this) 
    } 

    handleChange(selectedValue) { 
     this.setState({ value: selectedValue }) 
    } 

    render() { 
     return (
      <Select 
       name="form-field-name" 
       value={this.state.value} 
       options={options} 
       onChange={this.handleChange} /> 
     ) 
    } 
}

來源

2017-03-17 08:55:21

我已經得到了我的初始值，tnx，但是當我點擊它時該值仍然不會改變應該在我的logChange方法上添加參數嗎？ –

它看起來像我控制的組件（https://facebook.github.io/react/docs/forms.html#controlled-components）。我認爲onChange函數可以讓你設置你應該使用的狀態值。 –

Tnx男人。我認爲反應選擇會爲我做所有事情。但它似乎沒有.. –

無法獲得輸入選擇表單的初始值

回答

相關問題