Vuejs数组推送

Question

我正在从后端接收以下格式的对象数组。我正在尝试获取此数据并将其推送到 JavaScript 数组中，以便以后可以根据需要使用它们。

[
    {
    id: 1,
    name: "Dr. Darrin Frami III",
    email: "darrin67@example.com",
    address: "42568 Cameron Cove Fritschborough, MA 86432-0749",

    },
]

这是我的 vuejs 代码：

<script>
    export default {
      data(){
        return {
          fakeUsers: [],
          fakeUser: {id: '', name: '', email: ''},
        } 
      },
      methods:{

      },
        mounted() {
            var route = '/get-users';
            this.$http.get(route).then((response)=>{
              for (var i = 0; i < response.data.length; i++) {
                 this.fakeUser.id = response.data[i].id;
                 this.fakeUser.name = response.data[i].name;
                 this.fakeUser.email = response.data[i].email;
                 this.fakeUsers.push(this.fakeUser);
              }

            });
            console.log(this.fakeUsers);
            console.log(this.fakeUsers[0]);
        }
    }
</script>

vue-dev 工具结果：

行 console.log(this.fakeUsers); 的输出是 [__ob__: Observer]。它不应该打印类似 [Array[10]] 的东西吗？

行 console.log(this.fakeUsers[0]); 的输出是 undefined，我不明白为什么。

Answer 1

$http() 创建一个异步 ajax 调用，因此 then() 中的代码在控制台命令之后执行。

简单的解决方案：将控制台命令也放入 .then() 中的函数中。

Vuejs数组推送

Vuejs array push

javascript

arrays

vue.js

vuejs2