Я хочу установить внутреннее состояние и позже вызвать обработку события из родительского компонента, однако я не могу вызвать его как обычную функцию.
Мне нужно изменить внутреннее состояние, иначе календарь не закроется, если я не нажму за пределами поля
Это не работает
import React, {useState} from "react"
import PropTypes from "prop-types"
import { DropButton, Box, Calendar} from "grommet"
const CalButton = ( { label,size="medium",onUpdate } ) =>
{
const [open,setOpen] = useState(false)
return (
<Box align="center">
<Calendar open={open} range size={ size } onSelect={handleOnSelect} />
</Box>
} />
)
}
CalButton.propTypes = {
label: PropTypes.string.isRequired,
size: PropTypes.string,
}
export default CalButton
это работает
import React, {useState} from "react"
import PropTypes from "prop-types"
import { DropButton, Box, Calendar} from "grommet"
const CalButton = ( { label,size="medium",onUpdate } ) =>
{
const [open,setOpen] = useState(false)
const handleOnSelect = (value) => {
Array.isArray(value) ? setOpen(false) : null
onUpdate(value)
}
return (
<Box align="center">
<Calendar open={open} range size={ size } onSelect={onUpdate} />
</Box>
} />
)
}
CalButton.propTypes = {
label: PropTypes.string.isRequired,
size: PropTypes.string,
}
export default CalButton