javascript - 如何在 React Native 上的 Firebase 中获取特定文档的文档 ID？

Question

我正在开发一个项目，该项目允许用户通过姓名写匿名信件，并且我想向应用程序添加喜欢/不喜欢的功能。我对如何获取该帖子的特定文档 ID 以及如何将 likeCount 加 1(在下面代码中“？？？”所在的区域)感到困惑？我希望它在按下竖起大拇指图标时将 firebase 中的“likeCount”字段更新为 1。

这是我的代码部分，其中包含为每个 Firebase 文档映射的帖子(来自 Firebase 的数据):

function Home() {
  const [posts, setPosts] = useState([]);
  const [searchValue, setSearchValue] = useState("");
  const [filteredPosts, setFilteredPosts] = useState([]);
  const collectionRef = collection(db, "posts");

  useEffect(() => {
    const getPosts = async () => {
      const data = await getDocs(collectionRef);
      const filteredRef = query(
        collectionRef,
        where(`recipiant`, "==", `${searchValue}`)
      );

      const querySnapshot = await getDocs(filteredRef);
      let posts = [];
      querySnapshot.forEach((doc) => {
        posts.push(doc.data());
      });
      setFilteredPosts(posts);

      setPosts(
        searchValue
          ? filteredPosts
          : data.docs.map((doc) => ({ ...doc.data() }))
      );
    };

    getPosts();
  }, [searchValue, filteredPosts]);

  return (
    <ImageBackground source={image} style={styles.image}>
      <SafeAreaView style={styles.container}>
        <ScrollView>
          <View style={styles.header}>
            <Text style={styles.title}>Home</Text>
          </View>
          <Pressable>
            <Input
              placeholder="Search for a name"
              inputContainerStyle={styles.searchbar}
              inputStyle={styles.searchInput}
              placeholderTextColor="gray"
              onChangeText={(text) => setSearchValue(text)}
            />
          </Pressable>
          {posts.map((post, key) => {
            return (
              <View style={styles.postWrapper} key={key}>
                <View style={styles.btnWrapper}>
                  <View style={styles.likeBtn}>
                    <Icon
                      name="thumbs-up"
                      size={25}
                      color="#fff"
                      onPress={() => {
                        const postRef = doc(db, "posts", `????`);
                        updateDoc(postRef, {
                          likeCount: ????,
                        });
                      }}
                    />
                    <Text style={styles.likeCount}>{post.likeCount}</Text>
                  </View>
                  <Icon
                    name="thumbs-down"
                    size={25}
                    color="#fff"
                    onPress={() => {}}
                  />
                </View>
                <Card
                  containerStyle={{
                    backgroundColor: "rgba( 255, 255, 255, 0.5 )",
                    borderRadius: 50,
                    height: 300,
                    marginBottom: 25,
                    width: 330,
                    backdropFilter: "blur( 20px )",
                    padding: 20,
                  }}
                >
                  <Card.Title style={styles.notepadHeader}>Message.</Card.Title>

                  <View style={styles.center}>
                    <ScrollView>
                      <Text style={styles.notepadText}>
                        To: <Text style={styles.name}>{post.recipiant}</Text>
                      </Text>
                      <Text style={styles.notepadTextLetter}>
                        {post.letter}
                      </Text>
                      <Text style={styles.notepadFooter}>
                        From:{" "}
                        <Text
                          style={{
                            color: "#9e4aba",
                            fontSize: 20,
                          }}
                        >
                          {post.displayName}
                        </Text>
                      </Text>
                    </ScrollView>
                  </View>
                </Card>
              </View>
            );
          })}
        </ScrollView>
      </SafeAreaView>
    </ImageBackground>
  );
}

这就是我的 Firestore 的样子，我想检索圆圈中的文档 ID。

Answer 1

首先，您可以在“posts”数组中添加文档 ID，如下所示:

const posts = querySnapshot.docs.map((d) => ({ id: d.id, ...d.data() }));
setFilteredPosts(posts);

然后您可以在需要时读取帖子 ID:

<Icon
  name = "thumbs-up"
  size = {25}
  color = "#fff"
  onPress = {() => {
    const postRef = doc(db, "posts", post.id);
    updateDoc(postRef, {
      likeCount: ?? ?? ,
    });
  }
}
/>