React native Pull to refresh is not working

user_15143106 0
Viewed 159

I m trying to add pull to refresh to fetch my data from my api but it is not working and i can'y find the problem within the code:

 const[refresh,setRefresh]=useState(true)

  const onRefresh=()=>{
    try{
      axios
      .get('http://192.168.1.17:8000/File/')
      .then((response)=> {
         
          setFile(response.data);
          setFilteredFile(response.data)
          setEmpty(false)
          setRefresh(false);
  
  
      })}
      catch(error){console.log(error)          
      }
  }

useEffect(()=>{
    onRefresh()      
  },[])

  <FlatList style={DocumentStyle.flatstyle}
              keyExtractor={(item)=>item['id']}
              data={filteredfile}
              renderItem={renderItem}
              onRefresh={()=>onRefresh()}
              refreshing={refresh}
              />

react-native javascript
2 Answers

never mind me everyone, i haven't set my refresh back to true after the useEffect set it to false

user_151431060

The error is due to not importing useState, but you also need to import useEffect. I also dont see where some of the props your passing to FlatList are being used. But here's a working sample:

import {useState, useEffect} from 'react';

const FlatList = ({file, refreshing, onRefresh}) => {
return (
  <div>
    <p>{file}</p>
    <button onClick={() => onRefresh(2)}>Load another todo</button>
  </div>
 )
}

export default function App() {
const [refresh, setRefresh] = useState(true);
const [file, setFile] = useState('');

useEffect(() => onRefresh(), []);

const onRefresh = (id=1) => {
 try {
   fetch(`https://jsonplaceholder.typicode.com/todos/${id}`)
   .then(response => response.json())
   .then(json =>  {
     console.log(json)
     setFile(JSON.stringify(json))
     setRefresh(false);
   })
 }
 catch(error) {
   console.log(error);         
 }
}

  return <FlatList file={file} refreshing={refresh} onRefresh={onRefresh} />
}
user_9718230
Related