1

我正在通过构建一个小项目站点来自学如何编码，但我已经被困了几天，试图弄清楚如何更新用户的个人资料和帐户信息。我能够弄清楚如何检索和显示信息，但很难让他们更新它

目标：

  1. 更新他们在登录时使用的帐户电子邮件
  2. 更新他们存储在 Firestore 中的全名（我想出了这个）
  3. 在 Firestore 中更新其用户的文档 ID（用于他们的个人资料 slug）

到目前为止，我已经能够弄清楚如何在表单字段中显示所有三个，但只有如何在 Firestore 中更新用户的全名，而第 1 点和第 3 点仍然让我无法理解。

对于目标 2，我在这里使用了 Firestore 文档中的“更新文档” https://firebase.google.com/docs/firestore/manage-data/add-data成功运行

为了更新用户电子邮件，我尝试使用此处的更新电子邮件方法https://firebase.google.com/docs/auth/web/manage-users

Firestore 中文档的屏幕截图

<template>

  <v-container fill-height>
    <v-layout justify-center align-center v-if="profile">

      <v-flex xs12 sm8 md8 style="max-width: 600px">
        <v-card >
          <v-toolbar dark color="primary">
            <v-toolbar-title>Profile</v-toolbar-title>               
          </v-toolbar>


          <v-flex class="ml-3 my-4">
            <v-avatar size="75px" class="mr-2" >
                        <img
                        class="img-circle elevation-2 "
                        src="https://raw.githubusercontent.com/vuetifyjs/docs/dev/static/doc-images/lists/1.jpg"
                        >
                    </v-avatar>

                    <v-btn color="primary" >Upload</v-btn>
                    <v-btn>Delete</v-btn> 
          </v-flex>

          <v-spacer></v-spacer>
          <v-divider></v-divider>
          <v-spacer></v-spacer>
          <v-card-text>
            <v-form>
              <v-text-field 
                prepend-icon="person" 
                required 
                v-model="profile.fullname" 
                name="fullname" 
                label="Full Name" 
                type="text">
              </v-text-field>
              <v-text-field 
                v-if="user" 
                prepend-icon="email" 
                required 
                v-model="user.email" 
                name="email" 
                label="Email" 
                type="text">
              </v-text-field>
              <v-text-field 
                v-model="this.profile.id" 
                hint="Create a unique URL for your profile. Many people use their first and last name. <br> [Ex: reel.ly/misha.collins]"
                persistent-hint
                id="username"  
                prepend-icon="link" 
                name="username" 
                required
                label="Profile URL " 
                type="text">
              </v-text-field>
            </v-form>
          </v-card-text>
          <v-card-actions>
            <v-spacer></v-spacer>
            <!-- <p class="red-text center" v-if="feedback">{{ feedback }}</p> -->
            <v-btn flat @click.native="updatemyProfile" color="primary">Save</v-btn>
          </v-card-actions>
        </v-card>
        <!-- <v-card style="margin-top: 30px" class="elevation-2">
          <v-toolbar dark color="primary">
            <v-toolbar-title>Billing</v-toolbar-title>               
          </v-toolbar>
          <v-card-text>
            <v-form>

            </v-form>
          </v-card-text>
          <v-card-actions>
            <v-spacer></v-spacer> 
          <p class="red-text center" v-if="feedback">{{ feedback }}</p> 
           <v-btn flat @click.native="updateBilling" color="primary">Update Account</v-btn>
          </v-card-actions>
        </v-card> -->
      </v-flex>
    </v-layout>
  </v-container>

</template>

<script>
import db from '@/firebase/init'
import firebase from 'firebase'
import slugify from 'slugify'

export default {
    name: 'Account',
    data () {
      return {
        user: null,
        profile: null,
        feedback: null,
        docid: null
      }

    },

    created () {
      let ref = db.collection('users')        

        // get current profile to list full name
        ref.where('user_id', '==', firebase.auth().currentUser.uid).get()
        .then(snapshot => {
            snapshot.forEach(doc => {
                this.profile = doc.data(),
                this.profile.id = doc.id
            })
        })

        // get current user to list email
        firebase.auth().onAuthStateChanged((user) => {
          if (user) {
              this.user = user

              // console.log(this.user)
          } else {
              this.user.uid = null
          }
        })


    },
    methods: {
      updatemyProfile() {
        // working to change fullname but not document id
        let ref = db.collection('users')  

        // get current profile
        ref.where('user_id', '==', firebase.auth().currentUser.uid).get()
        .then(snapshot => {
            snapshot.forEach(doc => {
                this.profile = doc.data(),
                this.profile.id = doc.id
            })
        })

        var docRef = db.collection("users").doc(this.profile.id)

        return docRef.update({
          id: this.profile.id, // this is adding an id field and assigning this.profile.id value to it instead of updating the document id of the user
          fullname: this.profile.fullname
        })

        // update email address
        var user = firebase.auth().currentUser
          user.updateEmail(this.user.email).then(function() {
            console.log("success")
          }).catch(function(error) {
            // An error happened.
        })
        }
      }
}

</script>

任何帮助深表感谢！

4

1 回答 1

0

查看函数末尾的这段代码：

    var docRef = db.collection("users").doc(this.profile.id)

    return docRef.update({
      id: this.profile.id,
      fullname: this.profile.fullname
    })

    // update email address
    var user = firebase.auth().currentUser
      user.updateEmail(this.user.email).then(function() {
        console.log("success")
      }).catch(function(error) {
        // An error happened.
    })

return调用该方法后，您将使用关键字从函数中提前返回update()，这意味着函数中的任何代码（更新电子邮件地址）都不会运行。

于 2018-06-17T17:06:09.543 回答