使用 framer-motion 在 React 中更新动画列表

Question

What's the best way to animate list change using framer-motion when its rendered like that? linkArr is a state. I would like other elements to go up to smoothly replace element that was removed on top of them.

  <LinkShortenerContainer>
        <LinkShortener scrollToLink={scrollToLink} setLinkArr={setLinkArr} />
        <AnimatePresence>
          {linkArr.map((item) => {
            return (
              <ShortenedLink
                setLinkArr={setLinkArr}
                key={item.id}
                id={item.id}
                long={item.long}
                short={item.short}
              />
            );
          })}
          {/* div to scroll to after new ShortenedLink is rendered */}
          <div ref={ref}></div>
        </AnimatePresence>
      </LinkShortenerContainer>