Javascript Reactjs：让一个选择菜单设置另一个的值

这是使用react简而言之，问题在于我有两个表单中的选择菜单（作为同一组件的一部分），我想选择一个来设置另一个的选项。

一个选择显示所选月份的月份，另一个显示所选月份的天数。根据选择的月份，天数应显示该月份的正确数字（因此，如果月份选择了“一月”，则天数中有31天，如果月份选择了“二月”，则天数中有28天，依此类推）

我无法获取初始值以响应选择。我可以记录正确的值，但实际出现的日期选择从不从其初始状态更新

一些代码

我会触发：

<select defaultValue="Jan" onChange={() => { setMonthNumber(this.refs["month"]["value"]) }} ref="month">

处理该动作的减速器是：

const initialState = {
    currentMonth: "Jan"
};

const guestInformationEditReducer = (state = initialState, action) => {

    let localState = merge({}, state);

    switch (action.type) {
        case 'GUEST_INFORMATION_SET_MONTH':
            localState.currentMonth= action.message;
            return localState;
    }

    return state
};

export default guestInformationEditReducer;

我汇总了我的减速机，并在该文件中设置了（不包括其他减速机）：

然后在我的组件（名为GuestInformationEdit）中，我将以下内容连接起来：

const getGuestInformationComponentProps = state => {
    return {
        month: state.guestInformationEditComponent.currentMonth
    }
}

export default connect(getGuestInformationComponentProps)(GuestInformationEdit);

在组件的渲染方法中，我通过以下方式访问值：

const days = this.getDaysFromMonth(this.props.month);

getDaysFromMonth

只是一个开关，它构建了一个jsx

选项的集合，比如：

days.push(<option key={stringNum} value={stringNum}>{stringNum}</option>);

我只有31天，这是由减速器中的
initialState
设置的值。尽管我可能会尝试更改任何控制台日志，但它在视图中从未更改。为什么？我做错了什么/错过了什么？还有，所有这些对于这样的改变真的有必要吗？对于这样一件简单的事情来说，它似乎非常复杂


**编辑

在我的组件中，我有以下输出选择：

 <BootstrapFormGroup model="guestModel.BirthMonth" classes="col-xs-12 col-md-1 extra-four-percent" formLabel="Birth Month">
    <select defaultValue="Jan" onChange={() => { setMonthNumber(this.refs["month"]["value"]) }} ref="month" className="form-control">
        <option value="Jan">Jan</option>
        <option value="Feb">Feb</option>
        <option value="March">March</option>
        <option value="April">April</option>
        <option value="May">May</option>
        <option value="June">June</option>
        <option value="July">July</option>
        <option value="Aug">Aug</option>
        <option value="Sept">Sept</option>
        <option value="Oct">Oct</option>
        <option value="Nov">Nov</option>
        <option value="Dec">Dec</option>
    </select>
</BootstrapFormGroup>
{days}
<BootstrapFormGroup model="guestModel.BirthDay" classes="col-xs-12 col-md-1 extra-four-percent" formLabel="Birth Day">
    <select defaultValue="1" className="form-control">
        {days}
    </select>
</BootstrapFormGroup>


{setMonthNumber（this.refs[“month”][“value”]）}ref=“month”className=“form control”>
简
二月
前进
四月
也许
六月
七月
八月
九月
十月
十一月
12月
{天}
{天}

查看
{days}
的这两个实例？在我上面的代码中，第一个正确更新以响应月份的onChange选择，第二个除了显示初始状态，然后从不更新之外，什么也不做

days.push(<option key={stringNum} value={stringNum}>{stringNum}</option>);

<select defaultValue="1">
    {days}
</select>

 <BootstrapFormGroup model="guestModel.BirthMonth" classes="col-xs-12 col-md-1 extra-four-percent" formLabel="Birth Month">
    <select defaultValue="Jan" onChange={() => { setMonthNumber(this.refs["month"]["value"]) }} ref="month" className="form-control">
        <option value="Jan">Jan</option>
        <option value="Feb">Feb</option>
        <option value="March">March</option>
        <option value="April">April</option>
        <option value="May">May</option>
        <option value="June">June</option>
        <option value="July">July</option>
        <option value="Aug">Aug</option>
        <option value="Sept">Sept</option>
        <option value="Oct">Oct</option>
        <option value="Nov">Nov</option>
        <option value="Dec">Dec</option>
    </select>
</BootstrapFormGroup>
{days}
<BootstrapFormGroup model="guestModel.BirthDay" classes="col-xs-12 col-md-1 extra-four-percent" formLabel="Birth Day">
    <select defaultValue="1" className="form-control">
        {days}
    </select>
</BootstrapFormGroup>