如何使用AnimationMotion＆gt;在反应中？

Question

当动画结束时，我想删除DOM，但是我还没有在React Docs https://zh-hans.reactjs.org/docs/events.html#animation-events中找到Onend事件。

这是demo

Answer 1

我找到了Mayself的道路！

// jsx part
<animateMotion ref={handleMotionRef}></animateMotion>

// js part
  function handleMotionRef(node) {
    // node?.onend = () => {} or
    node?.addEventListener(
      'beginEvent',
      (e) => {
        e.target.parentNode.style.display = 'block';
      },
      false,
    );
    node?.addEventListener(
      'endEvent',
      (e) => {
        e.target.parentNode.style.display = 'none';
      },
      false,
    );
  }