0

我想创建一个组件，它由Datepicker和ChoiceGroup使用 ReactJs 和 office365 组成。在第一次渲染时必须禁用日期选择器，当我们在 ChoiceGroup 中选择自定义单选按钮时，它必须启用。一段代码：

<div>
                    <ChoiceGroup
                        defaultSelectedKey='all'
                        onChange={ this._onChange }
                        label='Date'
                        options={ [
                            {
                                key: 'all',
                                text: 'All'
                            },
                            {
                                key: 'thisWeek',
                                text: 'This week',
                            },
                            {
                                key: 'lastWeek',
                                text: 'Last week',
                            },
                            {
                                key: 'thisMonth',
                                text: 'This month',
                            },
                            {
                                key: 'custom',
                                text: 'Custom',
                            }
                        ] }

                    />

                            <DatePicker
                                label='label'
                                isRequired={ false }
                                disabled={ pickerDisabled }
                                strings={ strings }
                                allowTextInput={ false }
                                value={ value }
                            />

                </div>

选择器有disabled参数，我想在 ChoiceGrou 方法中更改它：

onChange = (ev, option) => {
        console.dir(option);
        if(option.key === 'custom') {
            this.setState({
                pickerDisabled: false
            })
        } else {
            this.setState({
                pickerDisabled: true
            })
        }
    }

此方法有效并更改参数，但 datepicker 组件的禁用不会更改。它保持不变，当我单击任何单选按钮时，我在控制台中出现错误：

Exception in DatePicker.componentWillReceiveProps(): TypeError: date1.getFullYear is not a function

这个错误的原因是什么？

4

1 回答 1

1

看来您正在value向DatePicker组件传递一个无效值，我的猜测（没有更多上下文/信息）是value/null默认undefined情况下，DatePicker默认为当天，但是value由单选按钮设置，它不是有效值（基于错误，它看起来像是DatePicker在期待一个Date对象（它正在尝试调用getFullYear()它），但它value是一个字符串）。

检查DatePicker组件的文档以了解其valueprop 中的预期内容并进行相应更新。

于 2017-08-24T15:48:50.720 回答