Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/vue.js/6.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Vue.js 无法通过vuejs将数组打印到表中_Vue.js_Axios - Fatal编程技术网

Vue.js 无法通过vuejs将数组打印到表中

Vue.js 无法通过vuejs将数组打印到表中,vue.js,axios,Vue.js,Axios,有人能告诉我为什么这个表格没有打印结果吗?axios似乎正在将数据拉入ok并打印到console.log,但视图没有输出到表中 <table id="app"> <tbody> <tr v-for="user in users"> <td>{{ user.id }}</td> <td>{{ user.name }}</td>

有人能告诉我为什么这个表格没有打印结果吗?axios似乎正在将数据拉入ok并打印到console.log,但视图没有输出到表中

<table id="app">
    <tbody>
        <tr v-for="user in users">
            <td>{{ user.id }}</td>
            <td>{{ user.name }}</td>
            <td>{{ user.email }}</td>
            <td>{{ user.phone }}</td>
        </tr>
    </tbody>
</table>

<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.0/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script>
    new Vue({
        el: "#app",
        data: {
            users: []
        },
        methods: {
            getAllUsers: function(){
                axios.get("http://example.net/users/process.php?action=read").then(function(response){
                    if(response.data.error){
                        app.errorMsg = response.data.message;
                    }
                    else{
                        app.users = response.data.users;
                        console.log(app.users);
                    }
                });
            }
        },
        mounted(){
            this.getAllUsers();
        }
    })
</script>

{{user.id}
{{user.name}
{{user.email}
{{user.phone}
新Vue({
el:“应用程序”,
数据:{
用户:[]
},
方法:{
getAllUsers:function(){
axios.get(“http://example.net/users/process.php?action=read)然后(函数(响应){
if(response.data.error){
app.errorMsg=response.data.message;
}
否则{
app.users=response.data.users;
console.log(app.users);
}
});
}
},
安装的(){
这个.getAllUsers();
}
})

谢谢你们的时间

哇,你们真快@谢谢你!我使用箭头进行了修改,然后使用这个。用户,它成功了

                getAllUsers: function(){
                    axios.get("http://example.net/users/process.php?action=read").then(response => {
                        if(response.data.error){
                            this.errorMsg = response.data.message;
                        }
                        else{
                            this.users = response.data.users;
                            console.log(this.users);
                        }
                    });
                }

检查你的控制台。它应该显示vuejs中的一些错误。您是否在任何地方定义
app
?如果不是,则
app
将只引用id为
app
的元素,这不是您想要的。我建议对
使用箭头函数,然后使用
回调,这样您就可以使用
this.users