Getting Player Instances

The following example demonstrates retrieving a dotLottie player instance and retrieving the manifest. The player instance can be used to call all the methods available:

pageMethods

import { useRef } from "react";
import type { DotLottieRefProps } from "@dotlottie/react-player";
import { DotLottiePlayer, Controls, PlayerEvents } from "@dotlottie/react-player";
import "@dotlottie/react-player/dist/index.css";

const App = () => {
  const lottieRef = useRef<DotLottieRefProps>();

  return (
    <div>
      <DotLottiePlayer
        lottieRef={lottieRef}
        style={{ height: "500px" }}
        onEvent={(event) => {
          if (event === PlayerEvents.Ready) {
            const manifest = lottieRef.current?.getManifest();
            console.log("manifest", manifest);
          }
        }}
        src="https://lottie.host/ffebcde0-ed6d-451a-b86a-35f693f249d7/7BMTlaBW7h.lottie"
        autoplay
        loop
      >
        <Controls />
      </DotLottiePlayer>
    </div>
  );
};

export default App;