У меня есть HOC, я подключаюсь к Redux. Я получаю ошибку от Flow:
Error:(23, 62) Cannot call NavigateClickWrapper with
PrimaryActionButton bound to ComposedComponent because property
navParams is missing in
Props [1] but exists in ComposedProps [2] in type argument Props [3].
Мой HOC:
type ComposedProps = {
navigationRouteName: navigationRouteName,
navParams: navParams,
preNavigation: () => any,
postNavigation: () => any
}
type ConnectedProps = ComposedProps & {
navigate: (navigationRouteName, navParams, simpleStackNavigation) => Promise<any>,
showSideBar: () => Promise<any>,
}
export const NavigateClickWrapper = (ComposedComponent: React.ComponentType<ComposedProps>) => connect(null, mapDispatchToProps)(
class extends React.Component<ConnectedProps> {
static defaultProps = {
preNavigation: () => {},
postNavigation: () => {},
}
render() {
return (
<ComposedComponent {...this.props} onClick={this.onClick}/>
)
}
onClick = () => {
this.props.preNavigation()
this.props.showSideBar()
this.props.navigate(this.props.navigationRouteName, this.props.navParams, this.props.hasOwnProperty('simpleStackNavigation'))
this.props.postNavigation()
}
}
)
const mapDispatchToProps = (dispatch, props) => {
return {
showSideBar: () => dispatch(showSideBar()),
navigate: (routeName, navParams = {}, inStackNavigator = false) => {
dispatch(SimpleStackNavigatorActions.navigate(routeName, navParams, inStackNavigator))
}
}
}
export default NavigateClickWrapper
Реализация:
const mapStateToProps = (state, props: Props) => {
return {
label: 'Move to Processing',
icon: <i className={'fa fa-long-arrow-right'} />,
onClick: props.onClick,
navigationRouteName: 'MoveToProcessing',
navParams: {id: props.id}
}
}
export default connect(mapStateToProps)(NavigateClickWrapper(PrimaryActionButton))
Компонент отрисовывается нормально. Я не совсем уверен, что еще мне нужно сделать, чтобы сообщить Flow о реквизитах, которые он получает. Это как-то связано с операторами двойного соединения?