向下滚动时，React Popper不会停留在其元素旁边

Question

我的目标是在单击按钮时显示共享选项的弹出窗口。当我在屏幕顶部时，一切看起来都很好。但是，当我向下滚动并单击它时，弹出窗口将显示在顶部，好像引用从未显示出新位置一样。不确定我在这里做错了什么，我已经十多次查看了文档，但仍然找不到答案。

render() {
    const { showOptions, toggleOptions } = this.props
    const { title, id } = this.props.post

    return (
      <Manager>
        <Reference>
          {({ ref }) => (
            <button ref={ref} onClick={toggleOptions} className="options-item">
              <img src={shareIcon} alt="Share Icon" />
            </button>
          )}
        </Reference>
        {showOptions && (
          <Popper innerRef={(elem) => elem} placement="top">
            {({ ref, style, placement }) => (
              <OptionsMenu ref={ref} style={style} data-placement={placement}>
                <OptionsItem
                  onClick={() => {
                    this.sharePost(
                      `https://www.facebook.com/dialog/share?app_id=${
                        process.env.FACEBOOK_APP_ID
                      }&href=https://fan.guru/p/${id}`,
                      toggleOptions,
                    )
                  }}
                >
                  <i className="fab fa-facebook" />
                </OptionsItem>
                <OptionsItem
                  onClick={() => {
                    this.sharePost(
                      `https://twitter.com/intent/tweet?text=${title} https://fan.guru/p/${id}`,
                      toggleOptions,
                    )
                  }}
                >
                  <i className="fab fa-twitter" />
                </OptionsItem>
                <OptionsItem
                  onClick={() => {
                    this.sharePost(
                      `https://www.reddit.com/submit?url=https://fan.guru/p/${id}&title=${title}`,
                      toggleOptions,
                    )
                  }}
                >
                  <i className="fab fa-reddit-alien" />
                </OptionsItem>
                <OptionsItem
                  onClick={() => {
                    this.sharePost(
                      `mailto:?subject=${title}&body=https://fan.guru/p/${id}`,
                      toggleOptions,
                    )
                  }}
                >
                  <i className="fas fa-envelope" />
                </OptionsItem>
                <OptionsItem
                  onClick={() => {
                    this.copyToClipboard(toggleOptions)
                  }}
                >
                  <i className="fas fa-link" />
                </OptionsItem>
              </OptionsMenu>
            )}
          </Popper>
        )}
      </Manager>
    )
  }
}

export default PostShareButton

const OptionsMenu = styled.div`
  background: #562e91;
  padding: 10px;
  border-radius: 10px;
  > * {
    font-size: 10px;
  }
`

const OptionsItem = styled.button`
  color: white;
  font-size: 1.3em;
  margin: 0 5px;
`