0

嘿伙计们让我快速解释我的问题。

我目前有用户可以在其中搜索某些内容的组件。在他们单击按钮后，我从 Firebase 获取数据，然后将其存储在我之后映射的 useState 中。这整个操作在一个功能中。

但是现在我在同一个页面上显示结果，因为我不知道如何将 useState 中的数据传输到其他组件。


const handleClick = async () => {

    
    
    const kurzRef = collectionGroup(db, 'kurzwaffensub' );
    const MOD = query(kurzRef,where("kurzModell", "==", `${kurzModell}` ));

if(kurzModell) {

const getWaffenDaten = async () => {
    const modell = await getDocs(MOD);
    const data = [];

for (const doc of modell.docs) {



  const parentDoc = await getDoc(doc.ref.parent.parent);
  const { Name, avatar,avatarPath, Erfahrung, Adresse, Schützenverein } = parentDoc.data();

  
  const  waffenbilderRef = collection(db, 'users', doc.data().uid, 'waffenbildersub')
  const subCollectionDocs = await getDocs(waffenbilderRef)
  const subCollectionData = subCollectionDocs.docs.map((doc) => {
                  return { id: doc.id, ...doc.data()}
  })
  

   data.push({
     ...doc.data(),
        Name,
        subCollectionData,
        avatar,
        avatarPath,
        Erfahrung,
        Adresse,
        Schützenverein
   });

}
      setTest(data)    
 }
    getWaffenDaten()

}

在该操作之后，我只是在同一个 Page 中返回 Result 。我想在 onClick 事件之后用结果更改页面。因为我不想看到搜索组件的用户界面。

也许它很简单，但我仍然是一个初学者，如果你能帮助我并教我一些新的和重要的东西，我会很高兴。

4

1 回答 1

0

您可以通过多种方式执行此操作：

  1. 如果您使用路由器并从结果页面获取数据，则可以将搜索查询作为 URL 参数传递
  2. 您可以使用 Redux 等状态管理工具或内置的上下文 api。
于 2022-01-16T03:41:57.853 回答