首页 > 解决方案 > 无法在 Vue 模板中显示 JSON 响应数据

问题描述

跟随关于 vue 和 nodejs 全栈 Web 开发的视频教程。我无法从 node.js API 获取 JSON 输出响应以显示在 vue.js 模板中,通知用户他们的帐户已成功创建。虽然错误显示来自 Postman 的验证消息,但无法使用 vue 在前端显示它。

在获取 JSON 数据响应之前,我尝试异步并等待我的 vue 注册方法。

注册组件

<script>
  data() {
    return {
      email: '',
      password: '',
      error: null
    }
  },
   methods:{
     async register () {
       try {
         await AuthenticationService.register({
          email: this.email,
          password: this.password
       })
       }catch (error) {
         this.error = error.responce.data.error
       }
      }
     }
   } 
</script>

这是我在 vue 模板上显示它的方式

<div class="error" v-html="error" />

我从 Google Chrome 控制台收到错误“[Vue 警告]:v-on 处理程序中的错误(Promise/async):“TypeError:无法读取未定义的属性“数据””。

我在这里做错了什么?

标签: javascriptnode.jsexpressvue.js

解决方案


推荐阅读