Question

我正在使用Vue资源连接到我的后端api。我有一个表单组件，我用它来创建一个新的资源项和修改现有的资源项。表单工作正常，但是当我想保存表单时，它需要使用正确的http方法进行api调用。如果我正在创建新项目，则应使用POST方法，如果我正在更新现有项目，则应使用PUT方法。现在，我的表单保存方法看起来像这样：

if(this.itemId > 0) {   // Update existing item
    myresource.update({id: this.itemId}, this.item).then(response => {
        //...
    }, response => {
        //...
    });
}
else {      // Post new item
    myresource.save({}, this.item).then(response => {
        //...
    }, response => {
        //...
    });
}

基本上，我必须使用if语句来检查是否使用update或save资源函数，然后成功/失败承诺都使用相同的代码。有没有办法将上述两种方法结合起来：

var method = this.itemId ? 'PUT' : 'POST';
myresource.request(method, {id: this.itemId}, this.item).then(response => {
        //...
    }, response => {
        //...
    });

上面的代码显然不起作用，但有没有类似的方法来实现这一点而不使用if语句并为每个请求类型重复我的成功/失败承诺？

Answer 1

一个简单的选择是根据条件创建请求，然后将剩余的promises连接到一个链中：

const request = (this.itemId > 0) ? myresource.update ? myresource.save;
request({
  id: this.itemId // Make the save call ignore the id
}, this.item).then(response => {
  // Shared code
});

Vue资源，使用相同的表单进行插入和更新

1 个答案: