Laravel - Fractal Pagination issue with Vue: accessing Meta -object fails

Hi,

I'm running Laravel 5.3 on Homestead and trying to get Fractal Pagination work with Vue.js.

However, I've run in issues trying to refer to "meta" object returned in the "response" from my backend. For some reason I can refer to e.g. user.name in my vue just fine, but have apparently no skills to access the fractal's "meta"-part. Say, if I try to access "meta.pagination.count", I get an error: TypeError: _vm.meta is null. Obviously I'm new to js.

What and how I try to access is found below:

My 'script' -part in .vue -file is as follows:

data () {
        return {
            loading: false,
            users: [ ],
            meta: null
        }
    },

    methods: {
        getUsers(page) {
            this.loading = true;

            this.$http.get('/user/list?page=' + page).then((response) => {
                this.users = response.body.data
                this.meta = response.body.meta
                this.loading = false;
                console.log(response.body.meta)
                console.log(response.body.data)
            })
        }
    },

mounted() {
        this.getUsers(1)
    },

My controller that is target of the $http request:

public function index()
{

    $users = User::paginate(2);
    $userCollection = $users->getCollection();

    return fractal()
    ->collection($userCollection)
    ->parseIncludes(['group'])
    ->transformWith(new UserTransformer)
    ->paginateWith(new IlluminatePaginatorAdapter($users))
    ->toArray();
}

The output I get in the response:

{

"data": [
    {
        "id": 3,
        "name": "new1",
        "email": "new1@new1.com",
        "created_at_human": "5 days ago",
        "group": {
            "data": {
                "id": 1,
                "title": "User",
                "created_at_human": "5 days ago"
            }
        }
    },
    {
        "id": 4,
        "name": "test",
        "email": "[email protected]",
        "created_at_human": "5 days ago",
        "group": {
            "data": {
                "id": 1,
                "title": "User",
                "created_at_human": "5 days ago"
            }
        }
    }
],
"meta": {
    "pagination": {
        "total": 4,
        "count": 2,
        "per_page": 2,
        "current_page": 1,
        "total_pages": 2,
        "links": {
            "next": "http://test.app:8000/user/list?page=2"
        }
    }
}

}

and in the Vue template I can access user.name -property, but not meta.pagination, which only throws the error.

Any ideas what's going wrong with my attempts to call e.g. "meta.pagination.count" ?

{{ meta.pagination.count }}

... which only leads to Uncaught TypeError: Cannot read property 'pagination' of null.

By the way, I've tried to set data()'s meta-property as an array too, but it then fails with syntax error exception...

Thank you!