Question

我试图将其绑定，好像似乎没有成功：)

firebaseInstance.auth().fetchSignInMethodsForEmail(this.signUpData.email)
  .then((response) => {
    ... all logic
  }).bind(this)

...因为它输出以下错误： firebaseInstance.auth(...).fetchSignInMethodsForEmail(...).bind is not a function

这是组件的逻辑，请问有人在Firebase响应解决后可以提出一种访问此组件的正确方法吗？：bowing：

import { VALIDATION_MESSAGES, VALUES } from './signup.module.config'
import GLOBAL_EVENTS from 'values/events'
import { firebaseInstance } from 'database'

export default {
  name: `SignUpForm`,
  data() {
    return {
      signUpData: {
        email: ``,
        password: ``,
        confirmPassword: ``
      }
    }
  },
  methods: {
    onEmailSignUp() {
      // Here this is component
      console.log(this.$refs)

      firebaseInstance.auth().fetchSignInMethodsForEmail(this.signUpData.email)
        .then((response) => {
            // other logic
          } else {
            // Here this is lost and equals undefined
            this.$refs.email.setCustomValidity(`error`)
          }
        })
    }
  }
}

Answer 1

bind指令应在函数对象上使用，而不是在函数返回值上使用。

这样做

firebaseInstance.auth().fetchSignInMethodsForEmail(this.signUpData.email) .then((response) => { ... all logic }).bind(this)

您尝试在您的promise的then方法的返回值上使用bind，这是一个promise对象，不能使用bind。

您可以尝试firebaseInstance.auth().fetchSignInMethodsForEmail(this.signUpData.email) .then(function(response){ ... all logic }.bind(this))

相反。这里的bind放在了promise发送函数中，因此它应该可以正常工作。我也将功能从箭头功能转换为普通功能，因为我认为不需要带绑定功能的箭头功能。

Answer 2

使用ES8异步/等待糖语法，您可以这样操作：

async onEmailSignUp () {
    try {
        const response = await firebaseInstance.auth().fetchSignInMethodsForEmail(this.signUpData.email)
        // other logic
    } catch (error) {
        console.log(error)
        this.$refs.email.setCustomValidity(`error`)
    }
}

访问组件的此内部Firebase承诺表述

2 个答案: