Vue提示setting a non-existent path "filelist" on a vm instance

Question

Vue提示
vue.js:1023 [Vue warn]: You are setting a non-existent path "filelist" on a vm instance. Consider pre-initializing the property with the "data" option for more reliable reactivity and better performance.

相关代码：

var Maincontent = Vue.extend({
    template: '#maincontent-template',

    route: {
        data: function() {
            return getfilelist();
        }}
});

期望是每次进入这个页面的时候，都重新请求这个函数拿新数据，感觉写在router中流程正确。

---

补充代码：

数据请求：

function getfilelist() {
    var info = Vue.http.get('http://192.168.233.233/study/project/main.json').then(successCallback, errorCallback);
    return info;
}


function successCallback(resp) {
    var infobody = resp.body;
    console.log(infobody);
    return infobody;
}

function errorCallback(resp) {
    console.log(resp);
}

请求的数据main.json

{
    "filelist": [
        {
            "id": 1,
            "pid": 0,
            "is_dir": 1,
            "filename": "dir1",
            "status": "正常",
            "size": 0,
            "modified_time": 1473746493
        }, {
            "id": 2,
            "pid": 0,
            "is_dir": 1,
            "filename": "dir2",
            "status": "正常",
            "size": 0,
            "modified_time": 1471069450
        }, {
            "id": 3,
            "pid": 0,
            "is_dir": 0,
            "filename": "file3",
            "status": "正常",
            "size": 300,
            "modified_time": 1473746492
        }, {
            "id": 4,
            "pid": 0,
            "is_dir": 0,
            "filename": "file4",
            "status": "正常",
            "size": 4000,
            "modified_time": 1471073051
        }, {
            "id": 5,
            "pid": 0,
            "is_dir": 0,
            "filename": "file5",
            "status": "正常",
            "size": 5,
            "modified_time": 1473747854
        }
    ]
}

请问如何解决？

---

已有的尝试：

试过在组件的data里直接写return getfilelist();，结果数据渲染不出来。

var Maincontent = Vue.extend({
    template: '#maincontent-template',
    data: function() {
        return getfilelist();//数据渲染不出来
    }
});

建立空对象也依旧报错

var Maincontent = Vue.extend({
    template: '#maincontent-template',
    data: function() {
        return {};//仍然报错
    },
    route: {
        data: function() {
            return getfilelist();
        }}
});

Answer 1

getfilelist();是啥？

Answer 2

http://router.vuejs.org/zh-cn...

看官方文档吧

Answer 3

getfilelist 返回的是空的，数据还没请求回来呢，数据只有在successCallback里才有。
大概要这么写：

var self = this
Vue.http.get('http://192.168.233.233/study/project/main.json').then(function (info) {
    self.info = info
}, errorCallback);