Filtering Results before rendering, with value returned from an api as a filter parameter

Asked

Viewed 97 times

0

I have a form, which has two related fields, a group and a subgroup, so when I upload the data from the api to popular the screen, I get all the groups and all the subgroups, stored in a state and step for the DOM render, Is there any way to use information I received from the uploaded data, in case the group(a group_id) to filter the second Answer before loading the screen? because when I try, the DOM sees the filtrates as Undefined

Follow the example code

  const [grupo, setGrupo] = useState([]);
  const [subGrupo, setSubGrupo] = useState([]);
  const [subGrupoFilter, setSubgrupoFilter] = useState([]);
  const [metaPessoa,setMetaPessoa] = useState();
    

  async function groupHandler() {
    await api
      .get("/pessoasgrupos", { headers: { token: isAuth().token_lg } })
      .then((response) => {
        setGrupo(response.data);
      });
  }
  async function subgroupHandler() {
    await api
      .get("/pessoassubgrupos", {
        headers: { token: isAuth().token_lg },
      })
      .then((response) => {
        setSubGrupo(response.data);
        setSubgrupoFilter(
          response.data.map((sg) => sg.cod_grupoowner === metaPessoa.cod_grupo)
        );
      });
  }

useEffect(() => {
    if (!metaPessoa) {
      if (pessoa) {
        api
          .get("/pessoa", {
            params: { codigo: pessoa, somenteclientes: false },
            headers: { token: isAuth().token_lg },
          })
          .then((response) => {
            if (response.statusText == "OK") {
              setMetaPessoa(response.data);
            } else {
              alert("Error");
            }
          });
      }
      groupHandler() 
      subgroupHandler()
    }
  }, []);

When filter, and I try to render the result in the DOM, it only shows Undefined, although if I change something in the code and save, the Reload of the active React, and it ceases to be Undefined and receives the values. What would be the best way to work this filter?

  • There’s no way to test your code, but you tried to pass metaPessoa for the Istener of useEffect? I don’t know if it goes into infinite loop, but I’m thinking about how to understand the problem.

  • It would be interesting, but the metaPeople there in the context is the datasource of the page’s main form

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.