如何使用 Apollo graphql 和 Reacr 创建行数据以填充表？

问题描述

我有一个使用 Apollographql 的 React SPA 从公共 API 获取数据，我需要帮助用检索到的数据填充表。

这是查询：

const GET_ALL_PEOPLE = gql`  
  query People($page: Int!) {
    people(page: $page){
      name
      height
      mass
      gender
      homeworld
    }
  }
`;

这是创建数据和行函数：

function createData(name,height,mass,gender,homeworld) {
    return { name,homeworld };
  }
  
  const rows = [
    createData({peopleData})
  ];

我不确定如何将数据添加到行中。

这是表：

if (peopleLoading) return <p>Loading...</p>
  if (peopleError) return <p>Whoops... something went wrong!</p>
  
  return (
    <TableContainer component={Paper}>
      <Table className={classes.table} aria-label="simple table">
        <TableHead>
          <TableRow>
            <TableCell>Characters</TableCell>
            <TableCell align="right">Height</TableCell>
            <TableCell align="right">Mass</TableCell>
            <TableCell align="right">Gender</TableCell>
            <TableCell align="right">Homeworld</TableCell>
          </TableRow>
        </TableHead>
        <TableBody>
          {rows.map((row) => (
            <TableRow key={row.name}>
              <TableCell component="th" scope="row">
                {history.push('http://localhost:4040/?name=${row.name}')}
              </TableCell>
              <TableCell align="right">{row.height}</TableCell>
              <TableCell align="right">{row.mass}</TableCell>
              <TableCell align="right">{row.gender}</TableCell>
              <TableCell align="right">{row.homeworld}</TableCell>
            </TableRow>
          ))}
        </TableBody>
      </Table>
    </TableContainer>
  );

查询：

表和控制台：

如何将数据添加到表中？感谢您的帮助

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）