1

我正在使用一组随机的 X 和 O 生成一个 JSON,并尝试使用聚合物中的自定义元素将它们绘制成一个简单的网格。当我第一次打开页面时,一切都运行良好,每次我都会看到不同的网格。我还在 index.html 页面上添加了一个按钮,该按钮使用一组新的 X 和 O 重新生成 JSON,但聚合物元素不会标记事件更改或使用新数据更新其子元素。

这似乎只是我的 JSON 对象的问题,因为如果我将其更改为字符串,我每次都会收到更改通知......

我编写了一个简单的“forceDB.js”脚本,该脚本生成 JSON 并将其传递给聚合物元素,.setAttribute('layout', data)我如何通知聚合物的更改并让我的聚合物脚本的所有子元素更新?

JSON 对象如下所示

let data = {
  "a1":"",
  "a2":"",
  "a3":"",
  "b1":"",
  "b2":"",
  "b3":"",
  "c1":"",
  "c2":"",
  "c3":""
};

我元素的聚合物脚本面看起来像这样......

enter code here
<script>
  Polymer({
    is:'grid-layout',
    properties:{
      layout: {
        type: Object,
        reflectToAttribute : true
      },
      observers: 'layoutChanged(layout.*)'
    },
    setLayout: function(newdb){
    console.log('new - ' + JSON.stringify(newdb));
    this.set('layout', newdb);
    },
    layoutChanged: function(changedthing){
    alert("Layout Changed!");
    },
  });
</script>

我认为我可能错过了聚合物的一个关键点,或者我做错了什么。但是我有一个简单的 X 和 O 游戏,我正在开发它来尝试掌握聚合物数据绑定原则,但似乎在哪里还不够。

4

1 回答 1

0

可能是布局属性需要:

notify: true

了解如何将布局属性数据绑定到 HTML 中的子元素可能会有所帮助。

于 2016-05-27T20:35:48.627 回答