Thursday, 11 November 2021

Trying to export data to csv file from my firebase data gives undefined

I have a list of data from my firebase firestore that I want to export to .csv

I did everything that is required but when I add the values that I want to be exported they are always undefined.

I am not an expert in react I am somewhat intermediate but I think it is because I am setting my data inside a useEffect Hook.

My data useState is undefined, although it holds values and I can see them in my table, which is causing the CSVLink to throw errors.

How do I allow my data to be passed into the headers?

Here is my code:

  const [data, setData] = useState([]);
  const [id, setID] = useState("");
  const list = []
  const filteredList = []
  useEffect(() => {
    firebase.firestore().collection("Users").get().then((userSnapshot) => {

      userSnapshot.forEach((doc) => {
       
        const {powerAccount,first_name,registerDate,email,company,country,phone} = doc.data();
        setID(doc.data().usersID)
        list.push({
          usersID:doc.id,
          powerAccount:powerAccount,
          first_name:first_name,
          registerDate:registerDate,
          email:email,
          company:company,
          country:country,
          phone:phone,
        });
      });
      setData(list);
    });
  },[]);


const headers = [
                  // here all the keys give undefined.
    {label:'User',key:data.usersID},
    {label:'Account',key:data.powerAccount},
    {label:'Name',key:data.first_name},
    {label:'RegistrationDate',key:data.registerDate},
    {label:'Email',key:data.email},
    {label:'Company',key:data.company},
    {label:'Country',key:data.country},
    {label:'Phone',key:data.phone},
  ];

 const csvReport = {
    filename:"userReport.csv",
    headers:headers,
    data: data // also my data useState is undefined, although it holds values and i can see them in my table
  }

    return (
     <CSVLink  {...csvReport} >
            Export
     </CSVLink>
    )


from Trying to export data to csv file from my firebase data gives undefined

No comments:

Post a Comment