Firestore更新数组内对象字段求助（React+Firebase投票站）

你的需求可以直接通过Firestore的字段路径+增量操作实现，不需要映射整个choices数组，以下是修正后的方案及问题排查：

正确实现代码 #

首先确保你已正确导入Firestore所需的函数：

import { doc, updateDoc, increment } from "firebase/firestore";

然后使用以下代码更新指定选项的vote字段：

async function handleVote() {
  const pollRef = doc(db, "polls", id);
  try {
    // 直接通过数组索引+字段路径定位到目标vote字段
    await updateDoc(pollRef, {
      [`choices.${selectedChoice}.vote`]: increment(1),
    });
    console.log("投票成功，文档已更新");
  } catch (error) {
    console.log("更新文档失败: ", error);
  }
}

如果上述代码仍有问题，可以改用FieldPath构建路径（效果一致，但更严谨）：

import { doc, updateDoc, increment, FieldPath } from "firebase/firestore";

async function handleVote() {
  const pollRef = doc(db, "polls", id);
  // 用FieldPath明确指定字段路径
  const targetVoteField = new FieldPath("choices", selectedChoice, "vote");
  try {
    await updateDoc(pollRef, {
      [targetVoteField]: increment(1),
    });
    console.log("投票成功，文档已更新");
  } catch (error) {
    console.log("更新文档失败: ", error);
  }
}

你原有代码出错的可能原因 #

你提到代码会创建新选项并删除原有选项，大概率是以下情况之一：

• selectedChoice不是有效的0-based数组索引：比如索引超出了当前choices数组的长度，或者是字符串类型且无法转换为有效数字（比如"abc"），导致Firestore自动扩展数组并填充空值，看起来像是原有选项被删除
• 文档中的choices字段不是数组类型：如果choices是普通对象（而非数组），直接用索引路径会覆盖原有结构
• 未正确导入increment函数：导致代码执行异常，触发错误分支或意外的字段修改

注意事项 #

• 不需要先读取整个choices数组再更新，直接通过字段路径操作更高效，还能避免并发投票时的冲突（Firestore的increment是原子操作）
• 确保selectedChoice的值与choices数组的索引完全匹配（比如第一个选项索引是0，第二个是1，以此类推）

内容的提问来源于stack exchange，提问作者cany