использование objectFit в реквизитах gatsby-image

Question

Я пытаюсь использовать это свойство на gatsby-image: objectFit="none" это не имеет никакого эффекта - вместо этого появляется значение по умолчанию "cover".

Я могу исправить это с помощью css, но надеюсь, что в этом нет необходимости, никаких идей.

Вот код для картинки:

    <Img
        fluid={product.variants[imageLoc].image.localFile.childImageSharp.fluid}
        objectFit="none"
    />

Answer 1

Обратите внимание, что реквизиты objectFit & objectPosition используются только в том случае, если вы используете IE версию полифилла :

import Img from "gatsby-image/withIEPolyfill" <-- IE polyfill

<Img
  fixed={...}
  objectFit="cover"
  objectPosition="50% 50%"
/>

Если нет, вы должны передать их какобычные стили через imgStyle:

import Img from "gatsby-image" <-- regular

<Img
  fixed={...}
  imgStyle={{
    objectFit: "none",
    objectPosition="50% 50%",
  }}
/>