反應道具只在選擇兩次後改變狀態

Question

我正在使用React Select，由於某種原因，我的狀態只在選擇了兩次選項後纔會改變。

我有以下代碼：

var React = require('react'); 
import Select from 'react-select'; 

class VehicleSelect extends React.Component { 

    constructor(props) { 
    super(props); 

    this.state = { brandSelect: ""}; 

    } 

    _onChange(value) { 
    //console.log(value) - just to see what we recive from <Select /> 
    this.setState({brandSelect: value}); 
    console.log(this.state.brandSelect); 
    } 

    render() { 
    var options = [ 
    { value: 'Volkswagen', label: 'Volkswagen' }, 
    { value: 'SEAT', label: 'SEAT' }, 
    { value: 'SKODA', label: 'SKODA' } 
    ]; 


    return (
     <Select 
      name="form-field-name" 
      value={this.state.brandSelect} 
      options={options} 
      placeholder="Select a brand" 
      searchable={false} 
      onChange={this._onChange.bind(this)} 
     /> 
    ) 
    } 
}; 

// Export our component 
export default VehicleSelect; 

當其中一個選項被選中也不會console.log新的狀態但是如果我再次選擇該選項，它會。任何想法我錯了，我猜測，因爲狀態沒有顯示在console.log它不更新？

感謝

Answer 1

setState不會立即改變狀態。你需要使用回調。 Docs。

_onChange(value) { 
    //console.log(value) - just to see what we recive from <Select /> 
    this.setState({brandSelect: value},() => { 
     console.log(this.state.brandSelect); 
    }); 
    }