<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<dom-module id="my-data">
<script>
(function() {
let dataValue = [
{num: 'T001', status: '4', bground: 'num-sub'},
{num: 'T002', status: '4', bground: 'num-sub'},
{num: 'T003', status: '4', bground: 'num-sub'},
];
class MyData extends Polymer.Element {
static get is() { return 'my-data'; }
static get properties() { return {
data: {
type: Array,
value: dataValue,
readOnly: true,
notify: true
}
}}
}
window.customElements.define(MyData.is, MyData);
})();
</script>
</dom-module>
我创建了一个像上面那样的自定义元素my-data.html。 然后下面是my-app.html中的用法。 可能会呈现我的数据,但my-app.html似乎无法通过data: Array
属性获取我的数据信息。为什么Polymer自定义数据组件无法发送数据
<my-data data="{{data}}"></my-data>
<dom-repeat items="{{data}}" as="entry">
<template>
<my-num entry="[[entry]]" ></my-num>
</template>
</dom-repeat>
</template>
<script>
class MyApp extends Polymer.Element {
static get is() { return 'my-app'; }
static get properties() {
return {
data: {
type: Array,
}
}
}
}
window.customElements.define(MyApp.is, MyApp);
</script>
是这个吗?请参阅https://www.polymer-project.org/2.0/docs/devguide/templates#dom-repeat关于如何使用dom-repeat聚合物管理的模板。例如,请参阅https://codepen.io/johnthad/pen/zEzVLm。 – Thad
如果你要改变'my-data'中数组或对象的数据,你必须通知父元素。这可以使用Polymer的'this.set(...)'以'this.set('data',dataValue)'的方式处理。请参阅https://www.polymer-project.org/2.0/docs/devguide/model-data#set-path –