javascript - Care vor fi tipurile de proprietăți ale useSpring


Folosesc react spring pentru a anima căile SVG, comutând strokeDashArray. Aici am scris asta în componenta părinte

  const dashArrayAnimation = useSpring({
    loop: {
      reverse: true,
    },
    from: { strokeDasharray: toggle ? 0 : 5 },
    to: { strokeDasharray: toggle ? 0 : 8 },
    config: { duration: 500 },
  });

și trecând această constantă către componentele copil, în componentele copil încerc să definesc tipul proprietății sale

interface Props {
  type: Metric | undefined;
  animationTracker: {
    cardPositionName: string;
    mouseOver: boolean;
    trialType: number;
  };
  toggle: boolean;
  setToggle: React.Dispatch<React.SetStateAction<boolean>>;
  dashArrayAnimation: any;
}

Care va fi tipul său de proprietate?

Răspuns #1

Ar trebui să importați tipul SpringValues din bibliotecă. Apoi puteți transmite un obiect de valori care se referă la valorile dvs. from/to astfel:

import { SpringValues } from '@react-spring/web'

interface Props {
  type: Metric | undefined;
  animationTracker: {
    cardPositionName: string;
    mouseOver: boolean;
    trialType: number;
  };
  toggle: boolean;
  setToggle: React.Dispatch<React.SetStateAction<boolean>>;
  dashArrayAnimation: SpringValues<{ strokeDasharray: number }>;
}