Как использовать динамическую ссылку в следующем js-изображении?

Question

я хочу использовать динамическую ссылку в следующих js Image. Следующие Js предлагают

      <Image
        src="/me.png"
        alt="Picture of the author"
        width={500}
        height={500}
      />

Но я хочу использовать как

      const imageDynamic = [Image][1]

      <Image
        src="https://en.wikipedia.org/wiki/Image#/media/File:Image_created_with_a_mobile_phone.png" or {imageDynamic}
        alt="Picture of the author"
        width={500}
        height={500}
      />

изображение будет поступать из API, поэтому src изображения будет меняться каждый раз. Я не могу использовать ссылку в следующем js-изображении, можно ли использовать ссылку в следующем js-изображении?

Answer 1

Следующее изображение работает так же, как HTML imgярлык. Для динамического варианта использования вы должны получать динамические данные на страницу.

для получения динамических данных вы должны использовать getServerSidePropsили же getStaticPropsпередать динамическую поддержку через URL-адрес:https://nextjs.org/docs/basic-features/data-fetching

выборка данных работает только в pages/папку и не работают в компонентах. Если вы хотите использовать в компоненте, вы должны получить данные на странице и передать реквизит в компонент.