updateDoc 不接受变量作为字段名

Posted 2023-02-22

【中文标题】updateDoc 不接受变量作为字段名

【英文标题】：updateDoc doesn't accept variable as field name

【发布时间】：2021-12-24 17:36:19

【问题描述】：

我使用来自 fireStore 的函数 updateDoc。我也使用 VueJs 作为框架。我尝试使用用户输入 (member_name) 作为字段名称来创建嵌套文档。但是，我一直收到“意外关键字'this'。（42:20）”的错误。问题出在这部分。

this.member_name: 
      name: this.member_name,
      task: 0,
      task_status: 0,

你能帮我解决吗？以下是完整代码

<template>
    <div class="container shadow m-3 col-12">
    <div class="d-flex justify-content-center m-2">
        <h1>Add Member</h1>
    </div>
    <label for="member_name">Member name</label>
    <input class="form-control m-1" type="text" id="member_name" v-model="member_name"/>       
    <label for="member_email">Member Email</label>
    <input class="form-control m-1" type="email" id="member_email" v-model="member_email"/>       
    <div class="d-flex justify-content-center">
        <button @click.prevent="submit" class="btn btn-primary col-6 m-2">Submit</button>
    </div>
    </div>   
</template>

<script>
import firebaseApp from '@/firebase.js'
import  getFirestore  from "firebase/firestore"
import  doc, updateDoc from "firebase/firestore"
const db = getFirestore(firebaseApp);

import  getAuth, onAuthStateChanged  from "firebase/auth";

export default 
    name: "AddMember", 
    components: 
        
    , 
    data()
        return
            email:"",
            project_name:"",
            member_name:"",
            member_email:"",
        
    ,

    mounted()
        const auth = getAuth();
        onAuthStateChanged(auth, (user) => 
        if (user) 
            this.email = user.email
            console.log(this.email)
         else 
            console.log("Sorry")
        
        );
    ,

    methods: 
        async submit() 
            alert("Add new member successfully!")
            this.project_name = this.$route.query.project_name
            const projectDoc = doc(db, "projects", this.project_name);
            await updateDoc(projectDoc, 
                member_list: 
                    this.member_name: 
                        name: this.member_name,
                        task: 0,
                        task_status: 0,
                      
                ,
            );
        
    ,

</script>

<style>

</style>

【参考方案1】：

您可以使用[] 表示法将变量的值用作属性名称：

await updateDoc(projectDoc, 
    member_list: 
        [this.member_name]:  // ?
            name: this.member_name,
            task: 0,
            task_status: 0,
          
    ,
);

除此之外：如果您想将成员添加到现有的member_list 数组中，您需要使用array-union 运算符，如updating elements in an array field 上的文档中所示。

【讨论】：

有效！！非常感谢！

【参考方案2】：

您正在尝试为文档设置错误的值。在这段代码中：

await updateDoc(projectDoc, 
    member_list: 
        this.member_name: 
            name: this.member_name,
            task: 0,
            task_status: 0,
          
    ,
);

第三行应该声明对象的结构，但你引用的是一个值，这是错误的。

正确的方法是这样的：

await updateDoc(projectDoc, 
    member_list: 
        member_name:  // <- or use whatever you want to define this object
            name: this.member_name,
            task: 0,
            task_status: 0,
          
    ,
);

【讨论】：

我希望字段名称是用户的输入，而不仅仅是固定字段的名称。我尝试删除“this”，但现在 firebase 只是将其存储为“member_name”，而不是用户的输入。有没有办法将对象引用到值？