反応ウィジェットの値を設定するreduxストアのDropdownList

Question

反応ウィジェットのDropdownListコンポーネントをグローバル還元ストアに接続しようとしています。 ドロップダウンリストは、選択した値がthis.stateから取得された場合、その値を変更します。 onChangeハンドラ内で反応し、ウィジェットのドキュメントからのサンプルで ：

var DropdownList = ReactWidgets.DropdownList 
    , colors = ['orange', 'red', 'blue', 'purple']; 

var Example = React.createClass({ 
    getInitialState() { 
    return { value: colors[3] }; 
    }, 
    render() { 
    return (
    <DropdownList 
     data={colors} 
     value={this.state.value} 
     onChange={value => this.setState({ value })}/>) 
    } 
}); 

ReactDOM.render(<Example/>, mountNode); 

しかし、私は世界の再来店my codepen exampleからのDropDownListの値を設定したい：メソッドcomponentWillMountで

const colors = [ 
    { id: 0, name: 'orange'}, 
    { id: 1, name: 'purple'}, 
    { id: 2, name: 'red' }, 
    { id: 3, name: 'blue' }, 
    { id: 4, name: 'green' } 
]; 

class App extends React.Component { 

    componentWillMount() { 
     this.props.setSelectedColor(colors[1]); // !!! HELP, does not work !!! 
    } 

    render() { 
     return(
     <DropdownList className="form-control form-control-sm" 
        id="color-list" 
        valueField="id" 
        textField="name" 
        data={colors} 
        value={this.props.selectedColor} 
        onChange={(value) => this.props.setSelectedColor(value)} 
        />); 
    } 
} 

const reducers = { 
    list: setSelectedColor 
}; 

// global redux state <-> store 
const store = createStore(rootReducer); 

// connect to global redux store selectedColor 
function mapStateToProps (state) { 
    return { 
    selectedColor: state.selectedColor 
    } 
} 

// connect to global actions (setColor) to redux store 
function mapDispatchToProps(dispatch) { 
    return { 
    setSelectedColor: bindActionCreators(setColor, dispatch) 
    } 
} 

const AppForm = connect(
    mapStateToProps, 
    mapDispatchToProps 
)(App); 

ReactDOM.render(
    <Provider store={store}> 
    <AppForm /> 
    </Provider>, 
    document.getElementById('app') 
); 

（）I 2番目の要素（紫色）に初期値リストを設定しますが、動作しません！

私は間違っていますか？

Answer 1

私は減速機 "リスト" を通るパスの接続状態を修正：

const reducers = { 
    list: setSelectedColor 
}; 

function mapStateToProps (state) { 
    return { 
    selectedColor: state.list.selectedColor 
    } 
} 

万歳、今it作品！