[Vuejs]-Data received from laravel controller not updating to vue variable

by

0👍

✅

This is never print items array because it’s execute before the ajax response is filled.

    console.log('Component mounted.'+this.items)

That’s why your console is always blank. You can search about blocking and non blocking programming.

your code have small bug. Update your code and try this:

<h1>
 This request list
    Hello,{{items}}
</h1>

<ul class="list-group">
    <li class="list-group-item" v-for="t in items">{{t}}</li>
</ul>
...

<script>
    export default {
        data(){
            return {
                items:[],
            }
        },
        mounted: function () {
            this.getList();
        }

        methods: {
            let _this = this;
            axios.get('/allusers')
            .then((response) => _this.items = response.data) 
            .catch((error)=>console.log(error));
        },
    }
</script>

This can help you. Good luck.

Leave a comment