Como faço para usar o

Oi Renato, tudo bem?

Você está tentando usar um input do tipo arquivo para pegar uma imagem e exibir em um card, mas a imagem não está aparecendo, certo?

Para fazer isso no React, você pode criar um estado para armazenar o arquivo selecionado e então utilizar a URL criada para exibir a imagem. Veja o exemplo abaixo:

import React, { useState } from 'react';

function App() {
  const [image, setImage] = useState('');

  const handleImageChange = (event) => {
    setImage(URL.createObjectURL(event.target.files[0]));
  }

  return (
    <div className="App">
      <input type="file" onChange={handleImageChange} />
      <img src={image} alt="Imagem selecionada" />
    </div>
  );
}

export default App;

Neste exemplo, quando um arquivo é selecionado no input, a função handleImageChange é disparada. Essa função pega o arquivo selecionado (event.target.files[0]) e cria uma URL para ele usando URL.createObjectURL(). Essa URL é então armazenada no estado image e usada como o src da tag img.

Lembre-se de que essa é uma solução básica e pode não funcionar perfeitamente em todos os casos. Por exemplo, essa abordagem não funcionará se você precisar enviar a imagem para um servidor, pois a URL criada é apenas uma referência local ao arquivo.

Espero ter ajudado.

Um abraço e bons estudos.