Question

我正在使用vuejs和后端Django。当我向服务器发送请求然后它发送响应我已经使用控制台显示控制台日志中的任何错误。问题是我想要在vuejs模板中显示该响应。所以我什么都不知道..所以我该怎么办？

login: function () {
    // for storing token sent by server
    axiosInstance({
      method: 'post',
      url: '/auth/jwt/create/',
      data: {
        'password': this.credentials.password,
        'email': this.credentials.email
      }
    })
      .then(response => {
        this.non_field_errors.push(response.data.non_field_errors)
        console.log(response)
        console.log(response.data.token)
        this.$cookie.set('accesstoken', response.data.token, 1)
        this.$cookie.set('usertype', response.data.usertype, 1)
        console.log(this.$cookie.get('usertype'))
        this.$router.push('/')
      })
      .catch(e => {
        this.errors.push(e)
        console.error(e)
      })
  }
}

Answer 1

不确定为什么需要在控制台之外显示该错误。但是你想要，这是一个简单的方法。

首先，在数据对象中声明一个属性。

data: function() {
  errors: null
}

您可以像这样设置它的值。

login: function () {
 let that = this
// for storing token sent by server
axiosInstance({
  method: 'post',
  url: '/auth/jwt/create/',
  data: {
    'password': this.credentials.password,
    'email': this.credentials.email
  }
})
  .then(response => {
    //if success
  })
  .catch(e => {
    //if catch an error
    // set e or any of its props
    that.errors = e
  })
}

显示：

<pre v-text="errors"></pre>

<强>更新

工作小提琴：https://fiddle.jshell.net/Zugor/601tdxoe/

在vuejs模板中显示服务器响应

1 个答案: