Итак, у меня есть компонент, который выглядит примерно так:
const Touchable = <C: typeof TouchableHighlight | typeof TouchableOpacity>({ is: Component, onPress, otherProp, ...rest }: TouchableProps<C>) => {
const handlePress = useCallback((event) => {
// Do some important logic here
console.log(otherProp);
onPress?.(event);
}, [onPress, otherProp]);
return <Component {...rest} />;
};
Тогда мой первый подход к типам пропелетов выглядел так:
type TouchableProps<C> = ElementConfig<C> & {
is: C,
otherProp: string,
};
Но когда я попытался использовать Компонент «Поток» выдаст мне следующее сообщение:
Cannot create Touchable element because:
• property otherProp is missing in object type [1] but exists in props [2].
• property is is missing in object type [1] but exists in props [2].
Это заставляет меня думать, что я либо не понимаю, как работает &
, либо это ошибка. В любом случае, тогда я попробовал следующее:
type TouchableProps<C> = ElementProps<C> & {
is: C,
otherProp: string,
};
И я получил эту ошибку:
All branches are incompatible:
• Either property onPress is missing in mixed [1].
• Or property onPress is missing in object type [2].
Я действительно не ожидал, что это изменится, но, очевидно, сообщение об ошибке другое ...
Моя следующая идея была:
type TouchableProps<C> = {|
...ElementConfig<C>,
is: C,
otherProp: string,
|};
Это сработало, но не совсем так, как я ожидал. Каким-то образом таким образом поток принимает все, что я передаю Touchable
, в качестве действительного реквизита, который для меня аналогичен отсутствию типов вообще ...
Это ошибка? Я делаю что-то неправильно? Любые идеи о том, как сделать это правильно?