Vue.js：vue-resource 使用路径参数调用 resource.save()

Posted 2023-02-22

【中文标题】Vue.js：vue-resource 使用路径参数调用 resource.save()

【英文标题】：Vue.js: vue-resource calling resource.save() with path parameter

【发布时间】：2016-08-30 22:52:45

【问题描述】：

我定义了一个vue-resource：

resources.js：

import Vue from 'vue'
import VueResource from 'vue-resource'

Vue.use(VueResource);

export const Team = Vue.resource('team/id/action');

那么，如果我对该资源调用 get 方法：

api = require('.api/resources')
api.Team.get(
    id: 3233,
    action: 'details',
).then(function(response) 
    // ....
);

此 ajax 调用向：

/team/3233/details

问题：

但是当我使用.update 或.save 而不是.get 时，请求的url 并不像预期的那样：

api = require('.api/resources')
api.Team.update(
    id: 3233,
    action: 'details',
).then(function(response) 
    // ....
);

我只向/team 发送请求，请求正文中传输了所有参数。

如何在.save 或.update ajax 调用中指定url 参数？

【参考方案1】：

只要在方法调用上添加第二个参数就可以了：

api = require('.api/resources')
api.Team.update(
    id: 3233,
    action: 'details',
, ).then(function(response) 
    // ....
);

当 vue-resource 在一个带有 body 的方法上调用 ajax 时，它接受一个或两个数据参数。

如果给定一个参数，则将其视为正文有效负载。

如果给定两个参数，第一个是路由参数，第二个是body payload。

所以，如果要指定路由参数，只需给一个空对象作为第二个参数即可。