Vue记录两次

时间:2018-09-13 09:37:18

标签: laravel vue.js login promise

我正在尝试向我的项目中添加日志记录组件,但是我必须登录两次才能被记录。这是我的代码:

login: function () {
                  var self = this
                  if (this.valid) {
                        const { email, password } = this
                        this.isLoading = true
                        this.$store.dispatch(AUTH_REQUEST, { email, password }).then(function () {
                              self.isLoading = false
                              self.$router.push({name: 'landing'})
                        }).catch(function () {
                              self.isLoading = false
                              self.password = ''
                              self.passwordErrorMessage = ['Złe hasło']
                              self.passwordError = true
                        })
                  }
            }

登录功能调度动作AUTH_REQUEST:

[AUTH_REQUEST]: function ({commit, dispatch}, user) {
            return new Promise(function (resolve, reject) {
                  commit(AUTH_REQUEST)
                  apiCall('login', user).then(function (response) {
                        localStorage.setItem('user-token', response.data.token)
                        Vue.http.defaults.headers.common['Authorization'] = (localStorage.getItem('user-token') !== null ? ('bearer ' + localStorage.getItem('user-token')) : ('bearer ' + localStorage.getItem('user-token')))
                        commit(AUTH_SUCCESS, response)
                        dispatch(USER_REQUEST)
                        resolve(response)
                  }).catch(async function (error) {
                        commit(AUTH_ERROR, error)
                        localStorage.removeItem('user-token')
                        reject(error)
                  })
            })
      },

还有我的apiCall:

const apiCall = (variable, args = {}) => new Promise((resolve, reject) => {
      if (typeof calls[variable] === 'undefined') return null
      var api = calls[variable]
      var promise = null
      var parsed = parseUrl(api.url, args)
      args = parsed.args
      // console.log(args)
      switch (api.method) {
            case 'POST':
            promise = Vue.http.post(parsed.url, args)
            break
            case 'GET':
            promise = Vue.http.get(parsed.url + transformData(args))
            break
            case 'DELETE':
            promise = Vue.http.delete(parsed.url + transformData(args))
            break
            case 'PATCH':
            promise = Vue.http.patch(parsed.url, args)
            break
      }
      console.log(parsed.url)
      console.log(promise)
      promise.then(function (response) {
            resolve(response)
      }).catch(function (error) {
            // console.log(error)
            if (error.response.status === 401) {
                  store.dispatch(AUTH_TIMEOUT)
            } else {
                  reject(error.response)
            }
      })
})

这种情况是,我第一次尝试就会得到这样的承诺:

auth/login
Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}

第二次尝试:

auth/login
Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined}

__proto__
:
Promise
[[PromiseStatus]]
:
"resolved"
[[PromiseValue]]
:
Object

因此,我的诺言没有得到原型,显然这是解决我的回应所必需的。我已经用邮递员测试了api,每次都能正常运行。我将Laravel用于API。有什么想法吗?

0 个答案:

没有答案