Typescript: React Native ссылка веб-пользователя на Pressable — как определить тип

#typescript #react-native #react-native-web

#typescript #react-native #react-native-web

Вопрос:

Как я могу правильно настроить ввод для этой ссылки?

Я получаю предупреждение typescript при использовании .contains in buttonRef.current?.contains() .

Насколько я знаю, .contains() существует только в Интернете. Помимо этого, код работает в Интернете.

Код по сути является прослушивателем, который определяет, что было нажато.

Полный пример: закуска на выставке

Соответствующая часть кода:

   // How to properly define the ref?
  const buttonRef = React.useRef(null);
  const orangeRef = React.useRef(null);

  React.useEffect(() => {
    if (Platform.OS !== 'web') return;
    const handler = (e: MouseEvent) => {
      const target = e.target;

      // Want to avoid the ts warning here saying contains doesn't exist on current
      if (buttonRef.current?.contains(target)) {
        setMsg('you clicked the button');
      } else if (orangeRef.current?.contains(target)) {
        setMsg('you clicked the orange box');
      } else {
        setMsg('you clicked the background');
      }
    };

    window.addEventListener('mousedown', handler);
    return () => window.removeEventListener('mousedown', handler);
  }, []);
 

Комментарии:

1. Используйте общий const buttonRef = React.useRef<Button>();