Как передать поток компонент, который абстрагирует несколько компонентов без создания Ho C? - PullRequest
0 голосов
/ 16 апреля 2020

Итак, у меня есть компонент, который выглядит примерно так:

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, в качестве действительного реквизита, который для меня аналогичен отсутствию типов вообще ...

Это ошибка? Я делаю что-то неправильно? Любые идеи о том, как сделать это правильно?

...