如何获取单据id和单据数据?

因此,我有一些文档的列表是我的应用程序,当我点击头像时,它将打开模式页面。在这个模式页面上,它将按我单击的文档显示信息。那么我该怎么做呢?我使用Cloud Firestore。

如何从集合中获取列表并在屏幕上显示:

useEffect(() => {
    const fetchRequest = async () => {
      const requestCollection = await db.collection("request").get();
      setRequest(
        requestCollection.docs.map((doc) => {
          return doc.data();
        })
      );
    };
    fetchRequest();
  }, []);


  return (
    <Panel id={id}>
      <PanelHeader left={<PanelHeaderBack onClick={go} data-to="home" />}>
        Обычные скины
      </PanelHeader>
      <Group header={<Header mode="secondary">Новые скины</Header>}></Group>
      {request.map((playerID) => {
        return (
          <Cell
          onClick={(e) => {openModal}
          key={playerID.player_id}
            style={{ marginBottom: 10 }}
            expandable
            indicator={
              <Counter size="s" mode="prominent">
                Новый скин
              </Counter>
            }
            before={<Avatar size={64} src={playerID.image} />}
          >Автор: {playerID.nickname}</Cell>
        );
      })}
    </Panel>
  );

模式页面:

 const modal = (
      <ModalRoot onClose={() => { setActiveModal(null)
      }}
       activeModal={activeModal}>
        <ModalPage id="skin_info"
        header={
          <ModalPageHeader
            right={<PanelHeaderButton onClick = {() => { setActiveModal(null)
            }} ><Icon24DoneOutline/></PanelHeaderButton>}
          >
            Карточка скина
          </ModalPageHeader>
        }>
           <Group title="MainInfo" header={<Header mode="secondary">Основная информация</Header>}>
           <Banner
           before={<Avatar size={48} />}
           header="Никнейм игрока:"
           subheader="ID Аккаунта:"
         />
          <SimpleCell>
          <InfoRow header="Комментарий игрока">
            Здесь расположен комментарий игрока.
          </InfoRow>
          </SimpleCell>
          <SimpleCell>
          <InfoRow header="Комментарий администратора">
            Здесь расположен комментарий администратора.
          </InfoRow>
          </SimpleCell>
          </Group>
          <Group title="Gallery" header={<Header mode="secondary">Галерея</Header>}>
          <Gallery
                slideWidth="90%"
                style={{ height: 150 }}
                bullets="dark"
              >
                <div style={{ backgroundColor: 'var(--destructive)' }} />
                <div style={{ backgroundColor: 'var(--button_commerce_background)' }} />
                <div style={{ backgroundColor: 'var(--accent)' }} />
              </Gallery>
              <Separator/>
          </Group>
        </ModalPage>
      </ModalRoot>
      ) 

它只是打开模式页面。通过这个,我需要获得id和我点击的所有文档数据。

转载请注明出处:http://www.intsu.net/article/20230512/1361275.html