Typescript печатает ссылку на сторонние пользовательские компоненты (реакции-проигрыватель)

Question

Описание

Я пытаюсь добавить аннотацию типа useRef, прикрепленную к этому компоненту игрока: реагирующий игрок , чтобы получить доступ к методу экземпляра seekTo как согласно исходному коду демонстрации документации . Кажется, я не могу заставить тип работать - я новичок в машинописи и, вероятно, ошибаюсь, поэтому любые указатели будут полезны! Я посмотрел на response-player index.d.ts и увидел, что там есть функция, просто нужно знать, как я должен писать это.

Ожидаемое поведение

Иметь доступ к методам экземпляра проигрывателя.

Ошибка

Property 'seekTo' does not exist on type 'MutableRefObject<ReactPlayer | null>'.ts(2339)

Шаги для воспроизведения

Я сделал небольшой codeSandbox - в основном попытка mimi c демонстрационного источника для добавления ссылки на использование метода seekTo onMouseUp на входе типа диапазона.

https://codesandbox.io/s/react-typescript-lqgvr?file= / src / index.tsx

Спасибо!

Answer 1

Несколько вещей относительно вашего кода:

1. Чтобы получить ссылку на реф, используйте ref.current вместо реф ..
2. Реф может быть нулевым, поэтому вам нужно проверить если это нуль
3. Используйте currentTarget события, чтобы получить доступ к значению вместо цели.

onMouseUp={(e) => {
            if (player.current) {
              player.current.seekTo(parseFloat(e.currentTarget.value));
            }
          }}