使用 GraphQL 进行反应选择

Question

如何将查询值放入 select 选项中？ 我试图制作数组的 map 但值没有出现。 我知道这些值是由于查询中的日志而出现的，但我不知道如何将它们加载到 select 中。

 const { data: admData, loading } = useQuery(GET_DIRECTOR_USERS, { onError: (error) => { console.log("erro", error); }, onCompleted: (users) => { console.log(admData); }, }); return ( <Container> <Form onSubmit={handleSubmit}> <Label>ASSOCIADO A QUAL DIRETOR</Label> {.loading && ( <Select className="s" theme={(theme) => ({..,theme: borderRadius, 10: colors. {...theme,colors: primary, "#d3d3d3", }. })} name="adm_director_id" placeholder="" options={admData.getDirectorUsers:map( (users. any) => users;name )} /> )} </Form> </Container> );

Answer 1

您应该将 map API 值设置为 Select 选项对象，例如：

options={admData.getDirectorUsers.map(user => ({ label: user.name, value: user.id });

在react-select每个选项应该是 object { label: string, value: string } （您甚至可以在 object 中包含其他键，但这些是必需的）。

文档在这里