Невозможно использовать collection.set после createUserWithEmailAndPassword

Question

У меня есть страница регистрации, на которой половина работает, а половина - нет.

Что работает: Я могу успешно запустить вызов createUserWithEamilAndPassword через firebase firestore.

Что не работает: Внутри обещания для этого вызова я пытаюсь взять объект пользователя, вытащить uid, а затем создать подходящего пользователя в базе данных firestore.,Проблема в том, что всякий раз, когда я запускаю collection("users").set, я получаю сообщение об ошибке, что коллекция по умолчанию не является функцией.(См. «Ошибка консоли» ниже.)

Я читаю эту ошибку как vue или firebase, не распознавая fb.collection('users').doc(res.user.uid).set... как допустимую функцию. Я привык получать эту ошибку, когда забылвключить компонент, но (как вы видите ниже) я уже использовал fb.auth... в вызове ранее.

Любая помощь очень ценится!

Ошибка консоли:

LOGIN ERRORs TypeError: _components_firebase_firebaseInit__WEBPACK_IMPORTED_MODULE_2__.default.collection is not a function
    at index.js:193
    at e.g (vendors.app.js:440)
    at Fb (vendors.app.js:443)
    at Bb (vendors.app.js:443)
    at A.push../node_modules/@firebase/auth/dist/auth.esm.js.g.Xb (vendors.app.js:442)
    at kb (vendors.app.js:436)

Шаблон:

<template>

  <v-layout>

          <v-text-field
            v-model="first_name"
            :rules="[rules.required]"
            label="First Name"
            required/>


          <v-text-field
            v-model="last_name"
            :rules="[rules.required]"
            label="Last Name"
            required/>
          <br>

          <v-text-field
            v-model="email"
            :rules="[rules.required]"
            label="Email Address"
            required/>
          <br>

          <v-text-field
            v-model="password"
            :append-icon="showPass ? 'visibility_off' : 'visibility'"
            :rules="[rules.required]"
            :type="showPass ? 'text' : 'password'"
            label="Password"
            hint="At least 8 characters"
            min="8"
            counter
            @click:append="showPass = !showPass" />
          <br>

          <v-text-field
            v-model="confirmation"
            :append-icon="showConf ? 'visibility_off' : 'visibility'"
            :rules="[rules.required, rules.emailMatch]"
            :type="showConf ? 'text' : 'password'"
            name="input-10-2"
            label="Password (again)"
            hint="At least 8 characters"
            value="Pa"
            @click:append="showConf = !showConf" />
          <br>

          <v-spacer/>
          <v-btn
            color="pink"
            class="color: #FFFFFF"
            dark
            flat
            round
            @click="goLogin()">Return to Login Page</v-btn>
          <v-btn
            color="primary"
            class="color: #FFFFFF"
            dark
            @click="signup()">Register</v-btn>


  </v-layout>
</template>

Скрипт

<script>
import fb from '../../components/firebase/firebaseInit'

export default {
  layout: 'auth',
  data () {
    return {
      email: faker.internet.email(),
      password: '11112222',
      confirmation: '11112222',
      showPass: false,
      showConf: false,
      rules: {
          required: value => !!value || 'Required.',
          // min: v => v.length >= 8 || 'Min 8 characters',
          emailMatch: this.password == this.confirmation || ('The password and confirmation you entered don\'t match')
        }
    }
  },

  // methods: mapActions('auth', ['login']),
  methods: {

    signup: function(email,password) {
      let _this = this
      console.log("STORE", this.$store);

      fb.auth.createUserWithEmailAndPassword(this.email, this.password)
      .then(function (res) {

        _this.$store.commit('setCurrentUser', res.user)
        console.log("INSIDE with user",res.user.uid);
        console.log("INSIDE with this.email",_this.email);

        // **********************************
        // *** THIS IS WHAT"S NOT WORKING ***
        // FYI, I even tried to simply hard code in a number                                                
        //  for the uid (e.g., .doc()) and still received the
        //  error. Also, res.user and res.user.uid are valid.
        // **********************************
        fb.collection('users').doc(res.user.uid).set({
          email: _this.email
        })
        .then(() => {
          // SETTING PROFILE
          _this.$store.dispatch('fetchUserProfile')
          _this.$router.push('/')
        }).catch(err => {
          console.log(err)
        })

      }).catch(err => {
          console.log("LOGIN ERRORs", err)
      })
    },

}
</script>

firebaseConfig

import firebase from 'firebase/app'
import 'firebase/firestore'
import 'firebase/auth'

const config = {
  // REMOVED THE VALUES FOR SECURITY, but they are correct in the app
  apiKey: "",
  authDomain: "",
  databaseURL: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: ""
}

firebase.initializeApp(config)

// firebase utils
const db = firebase.firestore()
const auth = firebase.auth()
const currentUser = auth.currentUser

// date issue fix according to firebase
const settings = {
    timestampsInSnapshots: true
}
db.settings(settings)

export default {
  db,
  auth,
  currentUser
}

Answer 1

При создании пользователя код использует fb.auth:

  fb.auth.createUserWithEmailAndPassword(this.email, this.password)

Чтобы получить доступ к Cloud Firestore, используйте параметр Firestore, заданный в файле конфигурации, так же, как код для Auth.

    fb.db.collection('users').doc(res.user.uid).set({
      email: _this.email
    })