reactjs - 加载时如何为 Nextjs/Image 添加淡入动画？

Question

我正在使用 next/image , 效果很好，除了实际加载的图像非常刺耳，而且没有动画或淡入。有没有办法做到这一点？我已经尝试了很多东西，但没有一个起作用。
这是我的代码:

<Image
  src={source}
  alt=""
  layout="responsive"
  width={750}
  height={height}
  className="bg-gray-400"
  loading="eager"
/>

根据docs我可以使用 className Prop ，但这些是立即加载的，我无法在加载后找到任何应​​用类的方法。
我也试过 onLoad ，并且根据这张票，它不受支持:
https://github.com/vercel/next.js/issues/20368

Answer 1

您可以尝试使用 next-placeholder达到这种效果