Animating a specific item from useSprings

[benslv]

I've created a list of animated cards with useSprings and was wondering what the best way to target the animation a card at a specific index would be (i.e. clicking a button to make card #3 animate)?

Currently my solution is just:

const springIndex = 2 // the index of the item I want to animate
api.start((i) => {
  if (i !== springIndex) return;
  return {
    x: 0,
    y: 0,
    config: { friction: 50, tension: 500 },
  };
});

Is there a better way to do this? I don't really like the idea of having to iterate through every item in the list and manually check if i is equal to my desired index.

[joshuaellis]

If i recall, you should be able to do api.current[index].start if you prefer.

I suppose we could also create a method of api.at(index)[METHOD] which might be a nice feature...