Raw Data Table error when handling state in React


#1

Hi, I have a React application using ChartFactor toolkit and sometimes it throws an error like this: Cannot read properties of undefined (reading "name) in my Raw Data Table. I create the Raw Data Table using the useEffect functionality. Maybe is a react problem? or something is missing?


#2

Hey @ralf, it seems like you are duplicating your queries, can i see your code, or maybe just a piece of the code that you are using for create the Raw Data Table?, usually it happens when you make a query more than one time with the same value in the .element()


#3

Sure, is something like this:

useEffect(() => {

        const table = cf
            .provider('Elasticsearch')
            .source(appSource)
            .rdt()
            .element(rdtId)
            .fields(getCompFields())
            .set('sizeColumnsToFit', true);

        table.execute();
    }, [company_name, company_location]);

#4

Yep i see the problem, some users had the same problem with the react state handle, the problem is that you are changing the value of the company_name and company_location at the same time in some point for that reason you are creating a query with the same id .element(rdtId), my suggestion is use the useEffect with an empty array in the params like this:

useEffect(() => {

        const table = cf
            .provider('Elasticsearch')
            .source(appSource)
            .rdt()
            .element(rdtId)
            .fields(getCompFields())
            .set('sizeColumnsToFit', true);

        table.execute();
    }, []);