Дочерний компонент имеет значение offsetTop, равное 0? - PullRequest
0 голосов
/ 22 января 2020

В настоящее время я ищу решение проблемы с дочерним компонентом.

У меня есть компонент, который обычно воспроизводит анимацию в соответствии с ее «видимостью» с помощью react-intersection-observer. Анимация прекрасно воспроизводится при прокрутке вниз, но у меня возникает проблема при прокрутке вверх (обычно анимация сбрасывается).

Я заметил, что мой дочерний компонент не имеет значения с его offsetTop. Можно ли по-прежнему воспроизводить анимацию или нет?

Вот часть моего кода:

const Info = () => {
  const [infoSetRef, infoRef, infoInView] = useScrollAnimation();

  return (
      <div ref={infoSetRef} style={{minHeight: '10px'}} className={`timeline-content${left ? ' right' : ''}`}>
        <Slide in={infoInView || (infoRef.current && infoRef.current.offsetTop < window.scrollY)}
               direction={left ? 'left' : 'right'} timeout={{enter: 800, exit: 1000}}>
          <div>
            <h2 className="timeline-content-date">{date}</h2>
            {image && <img src={image}/>}
          </div>
        </Slide>
        {/*language=CSS*/}
        <style jsx>{`
          h2 {
            font-size: 20px !important;
            padding-bottom: 5px !important;
            min-height: 60px !important;
          }
        `}</style>
      </div>
  )
}
...