问为什么我总是获得typeerror:而不是函数，同时尝试筛选或映射数组

EN

   const [gifdata, setGifdata] = useState([])
   const [Search, setSearch] = useState("")

   function handleChange(e) {
       setSearch(e.target.value)
   }

useEffect(()=> {
    axios.get(`https://api.giphy.com/v1/gifs/trending?api_key=nKEFKPSILLeIlqLEjqhVsRO8ShxIjfcn&limit=50&rating=g`)
   .then(res=>{
       setGifdata(res.data)
       console.log(res.data)
   })
}, [])

const filteringSearch = gifdata.filter(gif=>
   gif.title.toLowerCase().includes(Search.toLowerCase()))

   return (
       <div>
           <header className="bg-blue-600">
               <div className="logo">
                   <label htmlFor="logo">DejareX</label>
               </div>
           </header>
           <div className="heroSection mx-auto">
               <h1>GIF Collections at it's peak</h1>
               <p>loremipsum blah blah blah</p>
           
                   <input type="text" placeholder="Search For A GIF" onChange = {handleChange} />

                   {filteringSearch.map(gif => {
                       return (
                           <Gif 
                           key = {gif.id} 
                           gifImgSrc = {gif.images.original.webp}
                           description = {gif.title}
                           />
                       )
                   })}
       </div>
       </div>
   )
}