无法设置未定义的属性（设置 'projects'）

Question

我试图将 API 数据推送到数组，但我不断收到此错误：“AddProject.vue Uncaught (in promise) TypeError: 无法设置未定义的属性（设置 'projects')”。有什么建议吗？

newData 应该被推送到数组，我想从那里使用项目数组提取 API 数据。

Answer 1

首先，test() 应该是一个方法。其次，将项目中的右括号放在同一行。

Answer 2

您不想在 methods 中创建新函数，只需添加您的代码（但要确保挂载是异步的）：

<script >
export default {
  data() {
    return {
      projects: [
        
      ]
    }
  },
  async mounted() {
    const data = await fetch("https://jsonplaceholder.typicode.com/posts");
    const newData = await data.json();
    console.log(newData)
    this.projects = newData;
  }
}
</script>

你可以这样做：

  async mounted() {
    this.projects = await fetch("https://jsonplaceholder.typicode.com/posts").then(raw => raw.json());
  }

Example

Answer 3

错误是您在 function () 表示法中使用了 this。为了使其如您所愿工作，您应该使用箭头函数。

const test = async () => {
//...
}

无法设置未定义的属性（设置 'projects'）

Cannot set properties of undefined (setting 'projects')

vue.js

vuejs2

nuxt.js