Возникли проблемы при входе в форму для Firebase из-за ошибки: «email» должен быть допустимой строкой ». - PullRequest
Новая
       30

Возникли проблемы при входе в форму для Firebase из-за ошибки: «email» должен быть допустимой строкой ».

0 голосов
/ 18 апреля 2020

Добрый день, разработчики, в этом простом приложении, которое я создаю, не видят пробела в моей форме входа в firebase. Странно, что я могу зарегистрироваться, создав нового пользователя, но как только этот пользователь создан, и я попытаться войти с его данными безопасности получил эту ошибку: Ошибка в v-on обработчике: «Ошибка: ошибка: signInWithEmailAndPassword: Первый аргумент« email »должен быть допустимой строкой.».

Это приложение основано на Vue. Js имеет базовое c взаимодействие с Firebase, включая эту функцию signInWithEmailAndPassword. Здесь я ссылаюсь на часть моего кода, которая связана с моей проблемой 

HTML tag for Log In Form

<template>
  <v-container>
    <v-container >
      <v-layout>
        <v-flex  class='d-flex justify-center'>
          <v-card   style="width:300px ;height:300px;margin-top:90px">
            <v-card-text>
              <v-container>
                <form @submit.prevent="signUserIn">
                  <v-layout row>
                    <v-flex xs12>
                      <v-text-field
                        name="name"
                        label="name"
                        id="name"
                        v-model="name"
                        type="name"
                        required
                      ></v-text-field>
                    </v-flex>
                  </v-layout>

                  <v-layout row>
                    <v-flex xs12>
                      <v-text-field
                        name="email"
                        label="email"
                        id="email"
                        v-model="email"
                        type="email"
                        required
                      ></v-text-field>
                    </v-flex>
                  </v-layout>

                  <v-layout row>
                    <v-flex xs12>
                      <v-text-field
                        name="password"
                        label="password"
                        id="password"
                        v-model="password"
                        type="password"
                        required
                      ></v-text-field>
                    </v-flex>
                  </v-layout>
                  <v-layout row>
                    <v-flex xs12>
                      <v-btn type="submit" class="primary">Sign In</v-btn>
                    </v-flex>
                  </v-layout>
                </form>
              </v-container>
            </v-card-text>
          </v-card>
        </v-flex>
      </v-layout>
    </v-container>
  </v-container>
</template>

, а затем с помощью v-моделирования полей электронной почты, пароля и пользователя я устанавливаю это при возврате данных 

 data() {
    return {
      email: "",
      password: "",
      name: ""
    };
  },

Наконец, в качестве последнего шага этой первой части просто передайте информацию с v-моделированием, переданную с помощью этого метода, моему состоянию управления в Vuex, которое будет отвечать за подключение к Firebase: 

Script Method

methods: {
    ...mapActions(["signUserIn"]),
    signingIn() {
      this.$store.dispatch("signUserIn", {
        email: this.email,
        password: this.password
      });
    }
  }

Затем в моем состоянии управления функция входа была бы такой: 

ACTION

signUserIn({ commit }, userInfo) {
      firebase.auth().signInWithEmailAndPassword(userInfo.email, userInfo.password)

        .then(
          user => {
            const newUser = {
              id: user.uid,

            }
            commit('clearSettingAuthUserError')
            commit('settingSignedInUser', newUser)
          }
        )
        .catch(
          error => {
            commit('settingAuthUserError', error)
            console.log(error)
          }
        )
    },
MUTATION

 settingSignedInUser(state, payload) {
      state.user = payload
    },
GETTER
getUser(state) {
      return state.user
    },

Честно говоря, я не могу понять, где находится ошибка, как в моем HTML, так и в моем Vuex, так как это еще более запутанно, потому что это позволяет мне зарегистрироваться, не давая мне однажды созданный, войти с тем же пользователем. Может ли кто-нибудь дать мне подсказку о том, что я делаю неправильно? Спасибо и хорошего дня !!!

1 Ответ

0 голосов
/ 20 апреля 2020

Извините, это была моя собственная ошибка !!! ... действительно нужно проверять мой код много раз, прежде чем делать глупые вопросы, ребята. В методе, связанном с моим действием формы, я просто вызываю действие моего состояния управления 

<form @submit.prevent="signUserIn">WRONG

вместо вызова метода в моем компоненте, который отвечает за вызов этого действия из Vuex * 1004. * 

<form @submit.prevent=" signingIn">CORRECT

Спасибо Renaud Tarne c за время и интерес к ответу на мой вопрос. И очень жаль !!!

...