即使输入命令没有改变,我如何告诉 Polymer 2.0 函数结果发生了变化?考虑这个小例子,它修改了基本的polymer-2-starter-kit的my-view1:
<dom-module id="my-view1">
<template>
<style include="shared-styles">
:host {
display: block;
padding: 10px;
}
</style>
<div>[[getText(node)]]</div>
<paper-button on-tap="changeElements">Change elements</paper-button>
</template>
<script>
class MyView1 extends Polymer.Element {
static get is() { return 'my-view1'; }
static get properties() {
return {
node: {
type: Number,
value: 0
},
node2: {
type: Number,
value: 5
}
}
}
changeElements() {
this.node2 += 1;
console.log(this.getText(0));
}
getText(item) {
return this.node2;
}
}
window.customElements.define(MyView1.is, MyView1);
</script>
</dom-module>
当我单击按钮时,node2 以及 getText 的结果都会发生变化,并显示在控制台中。然而,所描绘的值始终保持在初始值5。我猜想,由于节点没有改变,所以改变没有被处理。是否可以通知 Polymer 函数结果的变化?像函数的notifyPath 之类的东西或类似的东西?或者我需要设置一些标志或类似的东西吗?
虽然我知道这个最小的示例可以通过仅输出 node2 而不是使用 getText(node) 轻松解决,但在我的常规项目中,它要复杂得多,其中函数根据不同因素计算输出。
最佳答案
对于...
<div>[[getText(node)]]</div>
...添加...
<div>[[getText(node, node2)]]</div>
并使用this.set('node2', number)将事件发送到[[getText]],以便它更新。使用 this.[variable] = XXX 设置变量通常不会更新任何内容。
养成使用 this.set 的习惯,否则当你开始使用 dom-repeat 和 dom-if 时,你会遇到真正的麻烦。
关于javascript - 通知 polymer 新功能结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45238740/