Polymer 1.0:多次调用iron-request的send()方法

Nei*_*ett 10 javascript ajax polymer polymer-1.0

我有一个组件,它使用一个实例<iron-ajax>从后端检索数据,我想<iron-request>用来发送更新,如POST/DELETE请求.

第一次一切都很完美.但是,如果再次调用请求,我会收到错误:

未捕获的TypeError:无法读取未定义的属性'then'

我的模板定义如下所示:

...
<iron-ajax id="ajax" auto verbose
    url="/cart-api/"
    last-response="{{ajaxResponse}}"
    handle-as="json">
</iron-ajax>

<iron-request id="xhr"></iron-request>
...
Run Code Online (Sandbox Code Playgroud)

在我的组件脚本中,我使用发送POST 的send()方法<iron-request>:

var me = this;
this.$.xhr.send({
    url: "/cart-api",
    method: "POST",
    body: JSON.stringify(entry)
}).then(function() {
    me._refresh();
}, function() {
    console.error("POST failed");
});
Run Code Online (Sandbox Code Playgroud)

错误消息表明send已返回undefined而不是有效的Promise对象.

所以我的问题是:一个<iron-request>元素实际上是可重用的吗?我是否需要做任何事情来刷新或重新初始化它?

UPDATE

感谢@Zikes我更新了我的代码如下:

<iron-ajax id="ajaxGet" auto
    url="/cart-api/"
    last-response="{{ajaxResponse}}"
    handle-as="json">
</iron-ajax>

<iron-ajax id="ajaxPost" url="/cart-api" method="POST" on-response="_refresh"></iron-ajax>

<iron-ajax id="ajaxDelete" method="DELETE" on-response="_refresh"></iron-ajax>
Run Code Online (Sandbox Code Playgroud)
insertEntry: function(entry) {
    this.$.ajaxPost.body = JSON.stringify(entry);
    this.$.ajaxPost.generateRequest();
},

_handleRemove: function(e) {
    var entry = e.currentTarget.entry;
    this.$.ajaxDelete.url = "/cart-api/" + entry.id;
    this.$.ajaxDelete.generateRequest();
},

_refresh: function() {
    this.$.ajaxGet.generateRequest();
},
Run Code Online (Sandbox Code Playgroud)

Zik*_*kes 6

<iron-ajax>组件<iron-request>为每个新请求生成一个新的:https://github.com/PolymerElements/iron-ajax/blob/master/iron-ajax.html#L442

如果您正在寻找可重用性(以及去抖动等其他不错的功能),那么使用该<iron-ajax>组件可能会更好.

  • 一旦你完成了属性的更改,就调用`this.$.ajax.generateRequest()`来发送请求并返回为该请求生成的`<iron-request>`组件. (2认同)