Polymer 1.0+ notify true 不工作
Polymer 1.0+ notify true not working
我不确定我的代码中发生了什么,可以使用一些关于可能发生的事情的指示。
一点背景...
我想让 "pizza" 在 "pizza" 中的任何内容发生变化时将其更改传递给 "selectedItem"。
现在输入代码:
以下是我的子元素js:
Polymer({
is:"order-pizza-mod",
behaviors: [
Polymer.NeonSharedElementAnimatableBehavior
],
properties: {
mobile: {
observer: "screenSizeChanged"
},
pizza: {
notify: true,
observer: "selectedPizza"
},
....
addToOrder: function () { //this is the function that will need to update my parent element.
this.set("pizza.ADD",true);
this.fire('selectPage',4);
console.log("SENT CHANGES");
console.log(this.pizza);
},
....
下面是我的父元素HTML和JS:
HTML:
<neon-animated-pages id="pages" selected="[[selected]]" class="overflow-catch">
...
<!-- 7 --><order-pizza-mod pizza="{{selectedItem}}"></order-pizza-mod>
...
</neon-animated-pages>
JS:
Polymer({
is:"page-order",
behaviors: [
Polymer.NeonSharedElementAnimatableBehavior
],
properties: {
...
selectedItem: {
observer:"selectionChanged"
},
},
....
selectionChanged: function () {
console.log("YAY, got all the things!");
},
....
关于可能发生的事情有什么想法吗?
所以我找到了一个解决方案,但它不是很好。
问题出在这里:
this.set("pizza.ADD",true);
目前聚合物有一个未解决的问题,"this.set" 函数不会触发通知。我也试过 "notifyPath" 也没有用。我发现强制聚合物触发通知的唯一方法是将变量重新分配给一个新对象,如下所示:
addToOrder: function () { //this is the function that will need to update my parent element.
this.pizza = {'ADD': true,
'CODE':this.pizza.CODE,
'GARNISHES':this.pizza.GARNISHES};
this.fire('selectPage',4);
console.log("SENT CHANGES");
console.log(this.pizza);
},
这很麻烦,但可以强制聚合物通知数据绑定变量。现在,如果有人知道更好的方法,请告诉我。
而不是这个
properties: {
selectedItem: {
observer:"selectionChanged"
}
}
这样做
observers: [
'selectionChanged(selectedItem.*)'
]
问题是 selectedItem
只有在引用了一个全新的对象时才会被视为已更改。但是您正在尝试观察 selectedItem
的 properties 的变化,这需要您观察 selectedItem.*
.
我不确定我的代码中发生了什么,可以使用一些关于可能发生的事情的指示。
一点背景...
我想让 "pizza" 在 "pizza" 中的任何内容发生变化时将其更改传递给 "selectedItem"。
现在输入代码:
以下是我的子元素js:
Polymer({
is:"order-pizza-mod",
behaviors: [
Polymer.NeonSharedElementAnimatableBehavior
],
properties: {
mobile: {
observer: "screenSizeChanged"
},
pizza: {
notify: true,
observer: "selectedPizza"
},
....
addToOrder: function () { //this is the function that will need to update my parent element.
this.set("pizza.ADD",true);
this.fire('selectPage',4);
console.log("SENT CHANGES");
console.log(this.pizza);
},
....
下面是我的父元素HTML和JS:
HTML:
<neon-animated-pages id="pages" selected="[[selected]]" class="overflow-catch">
...
<!-- 7 --><order-pizza-mod pizza="{{selectedItem}}"></order-pizza-mod>
...
</neon-animated-pages>
JS:
Polymer({
is:"page-order",
behaviors: [
Polymer.NeonSharedElementAnimatableBehavior
],
properties: {
...
selectedItem: {
observer:"selectionChanged"
},
},
....
selectionChanged: function () {
console.log("YAY, got all the things!");
},
....
关于可能发生的事情有什么想法吗?
所以我找到了一个解决方案,但它不是很好。
问题出在这里:
this.set("pizza.ADD",true);
目前聚合物有一个未解决的问题,"this.set" 函数不会触发通知。我也试过 "notifyPath" 也没有用。我发现强制聚合物触发通知的唯一方法是将变量重新分配给一个新对象,如下所示:
addToOrder: function () { //this is the function that will need to update my parent element.
this.pizza = {'ADD': true,
'CODE':this.pizza.CODE,
'GARNISHES':this.pizza.GARNISHES};
this.fire('selectPage',4);
console.log("SENT CHANGES");
console.log(this.pizza);
},
这很麻烦,但可以强制聚合物通知数据绑定变量。现在,如果有人知道更好的方法,请告诉我。
而不是这个
properties: {
selectedItem: {
observer:"selectionChanged"
}
}
这样做
observers: [
'selectionChanged(selectedItem.*)'
]
问题是 selectedItem
只有在引用了一个全新的对象时才会被视为已更改。但是您正在尝试观察 selectedItem
的 properties 的变化,这需要您观察 selectedItem.*
.