Estoy creando una página de publicación de Facebook para mi proyecto, y casi termino, pero no entiendo cómo cerrar el gif seleccionado y una vez que cierro el gif seleccionado no puedo obtener otro gif. Si alguien sabe por favor ayuda.
import axios from "axios"; import { useState } from "react"; import { useEffect } from "react"; import "./componentsStyles/GifInText.css" const GifInText = ({gifId}) => { const [post, setPost] = useState({}); const [closeGif, setCloseGif] = useState(false) const fetchData = async () =>{ await axios.get(`https://api.giphy.com/v1/gifs/${gifId}`,{ params: { api_key: "Xoa3mXrWxKXw6lJscrKUTsbZsXLbGuGY", gif_id: gifId } }).catch((error) =>{ console.log("error at fetching gifID2", error); }).then(response => { setPost(response.data) }); } useEffect(()=>{ fetchData() }, [ ]) return ( <div className='gif-section'> {post.data && ( <> <div className='image-gifs'> <i className="fas fa-times" onClick={()=>setCloseGif(!post)}></i> <img className="live-gifs" src={post.data.images.fixed_height.url} alt="..."/> </div> </> )} </div> ) } export default GifInText;Está configurando closeGif pero olvidó usarlo. Además, establecer setCloseGif(!post) siempre será falso.
return ( <div className='gif-section'> {post.data && !closeGif( <> <div className='image-gifs'> <i className="fas fa-times" onClick={()=>setCloseGif(post)}></i> <img className="live-gifs" src={post.data.images.fixed_height.url} alt="..."/> </div> </> )} </div> )