Invalid prop `data` supplied to `MaterialTable`, expected one of type [function]

user_13034524 0
Viewed 667

I am working in a jhipster application, with data coming from postgress sql. The api is http://localhost:8080/api/agreements and I am trying to display the data in a react material table but I am getting this error "Invalid prop data supplied to MaterialTable, expected one of type [function]" on my console after writing my functions.

Let me walk you through my codes below:

Inside the React component

  const apiUrl = 'http://localhost:8080/api/agreements';
  const [data, setData] = useState([]);


    useEffect(() => {
    getAgreementsData();
    }, []);

    const getAgreementsData = () => {
    fetch(apiUrl)
  .then(res => res.json())
  .then(res => setData(res));

};

Inside the JSX

      <MaterialTable
      title="Agreements"
      data={data}
      columns={columns}/>

The columns are displaying but the data is not.

And this warning is on the console " GET http://localhost:8080/api/agreements 401 (Unauthorized)"

jhipster material-ui react-hooks reactjs
2 Answers

I later resolved the error by using axios get instead of fetch.

     useEffect(() => {
     getAgreementsData();
      }, []);

     const getAgreementsData = () => {
     axios.get(apiUrl).then(res => setData(res.data));
      };
user_130345240

i also have thiss error , i cant parse my data into table. but i find where it is problem.

i parse my data like object -> export const CLIENT_DATA ={

 name: "Frontend site",
 contactPersonName: "Lukasz Swarz",
 contactPersonEmail: "lukasz@gmail.com",
 contactPersonPhone: "065438677282",
 description: "This is project, for car sell!",
 statusClient: "Active"

};

but you must do this with array brackets :

export const CLIENT_DATA =[{

 name: "Frontend site",
 contactPersonName: "Lukasz Swarz",
 contactPersonEmail: "lukasz@gmail.com",
 contactPersonPhone: "065438677282",
 description: "This is project, for car sell!",
 statusClient: "Active"

}]; in my case, this being problem, basic error,but take me a lot of time

user_195036990
Related