Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

192
Visualizações
React native: invaild source for image when source is a formatted string retrived from Firestore

I have saved following image source along with uri in firebase as a string

coverImage " uri: "https://images.unsplash.com/photo-1570102881689-c04ab4cf1f4c?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHx0b3BpYy1mZWVkfDF8Ym84alFLVGFFMFl8fGVufDB8fHx8&auto=format&fit=crop&w=400&q=60"

along with other attributes such as title extra. when i am passing the prop in the Image source the following error shows

Warning: Failed prop type: Invalid prop `source` supplied to `Image`, expected one of type [number].

following is the image prop.

<Image style={{ width: 250, height: 250 }} source={`{${item.image}}`} />

I have consoled.log the item.image and the link is working fine in when I ctrl+click on it. Any feedback as to what I am doing wrong.


In console.log I get the following result

Array [
  Object {
    "id": "al1tT6JfNYssimYZ8Lhy",
    "image": " uri: \"https://images.unsplash.com/photo-1570102881689-c04ab4cf1f4c?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHx0b3BpYy1mZWVkfDF8Ym84alFLVGFFMFl8fGVufDB8fHx8&auto=format&fit=crop&w=400&q=60\"",
    "title": "Lorem ipsum",
  },
]

and console.log the item.image when I render it through the flatlist following is the result.

uri: "https://images.unsplash.com/photo-1570102881689-c04ab4cf1f4c?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHx0b3BpYy1mZWVkfDF8Ym84alFLVGFFMFl8fGVufDB8fHx8&auto=format&fit=crop&w=400&q=60"
about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

Have you already tried this? <Image source={{ uri: item.image }} />

about 4 years ago · Juan Pablo Isaza Relatório

0

Try setting URI as shown below:

<Image style={{ width: 250, height: 250 }} source={{ uri: item.image }} />

Also the image field in the object seems to be prefixed with uri:, try setting an URL starting with https://.

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda