Блог

Я пытаюсь создать приложение vue, но когда я пытаюсь передать некоторые данные на другую страницу vue, я получаю длину 0, даже если есть данные, которые я получаю от моей функции axios.get(). Я даже не получаю никаких ошибок, которые я вижу.

Вот мой код

мой users.js

     Vue.component('users-app', require('./UsersApp.vue').default);
    Vue.component('users-table', require('./UsersTable.vue').default);

    if (document.getElementById('users')) {
        const blockRequest = new Vue({
            el: "#users",
            data() {
                return {
                    users: []
                }
            },
            methods: {
                getUsers(){
                    axios.get('/users/get-users').then(response => {
                        this.users = response.data.users;
                    });
                }
            },
            mounted() {
                this.getUsers();
            }
        });
    }
  

Это мой users.blade.php

     @section('content')
        <div class="row justify-content-center">
            <div class="col-md-12">
                <div id="users">
                    <users-app :users="users"></users-app>
                </div>
            </div>
        </div>
    @endsection
  

Мое пользовательское приложение, vue

     <template>
        <div class="row">
            <div class="col-md-6">
                
            </div>
            <div class="col-md-6">
            
            </div>
        </div>
    </template>

    <script>
        export default {
            props: ['users'],
            data() {
                return {
                  
                }
            },
            methods: {

            },
            mounted() {
                console.log(this.users);
            }
        }
    </script>
  

Попробуйте использовать this.$set(this, ‘users’, response.data.users) в вашем методе. Не уверен, что вы правильно его привязали.