我正在尝试实现SingleDatePicker,但我一直收到上述错误。由于我将初始值显然设置为布尔值,所以我在做什么错了。
这是我的实现方式
const [calendarFocused, setCalendarFocus] = useState(false); --this a boolean not an object?
const [createdAt, setCreatedAt] = useState(moment());
const onChange = (event) =>
setTimesheet({
...timesheet,
[event.target.name]: event.target.value,
});
const onDateChange = (createdAt) => setCreatedAt(createdAt);
const onCalendarFocusChange = (focused) => setCalendarFocus(focused); return (
<form>
<h5 className='text-primary'>Add time</h5>
<input
type='text'
placeholder='Enter title'
title='title'
value={title}
onChange={onChange}
/>
<select name='project'>
<option value='project' disabled defaultValue>
Choose your project
</option>
<option value='1'>Project 1</option>
<option value='2'>Project 2</option>
<option value='3'>Project 3</option>
</select>
<SingleDatePicker
date={createdAt} // momentPropTypes.momentObj or null
onDateChange={onDateChange} // PropTypes.func.isRequired
focused={calendarFocused} // PropTypes.bool
onFocusChange={onCalendarFocusChange} // PropTypes.func.isRequired
id='#123' // PropTypes.string.isRequired,
/>
<div>
<input
type='submit'
value='Add new time'
className='waves-effect waves-light btn-large'
/>
</div>
</form>
答案 0 :(得分:0)
我正在处理同样的问题。如果您使用 console.log(calendarFocused),它将在控制台上打印一个对象 [focused : false]。由于 SingleDatePicker 需要一个布尔值,这将引发错误。
要解决此问题,请将 SingleDatePicker 中的“focused”编辑为以下内容:
<SingleDatePicker
date={createdAt} // momentPropTypes.momentObj or null
onDateChange={onDateChange} // PropTypes.func.isRequired
focused={calendarFocused.focused} // PropTypes.bool
onFocusChange={onCalendarFocusChange} // PropTypes.func.isRequired
id='#123' // PropTypes.string.isRequired
/>