Vue.js来自另一个组件的Call方法

时间:2016-02-11 20:16:50

标签: javascript vue.js vue-resource

我有2个组件。如何在fetchProjectList()方法中调用createProject()方法。

第一个组成部分:

Vue.component('projects', {
    template: '#projects-template',

    data: function () {
        return {
            list: []
        }
    },

    ready: function () {
        this.fetchProjectList();
    },

    methods: {
        fetchProjectList: function () {
            resource.get().then(function (projects) {
                this.list = projects.data;
            }.bind(this));
        }
    }

});

第二个组件

Vue.component('createProjects', {
    template: '#create-projects-template',

    methods: {
        createProject: function () {
            resource.save({}, {name: this.name}).then(function () {
                this.fetchProjectList()
            }.bind(this), function (response) {
                // error callback
            });
        }
    }
});

1 个答案:

答案 0 :(得分:3)

你没有,或者说你不应该。组件不应以这种直接方式依赖于其他组件。

您应该将此方法提取到mixin中,或将其保存在自己的对象中,然后将其导入到每个组件中。

阅读商店模式:http://vuejs.org/guide/application.html#State_Management