我如何使用聚合物标记 JSON object 中的更改并从 javascript 传递数据然后渲染一些 child 元素

Question

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

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

我写了一个简单的 "forceDB.js" 脚本，它生成 JSON 并将其传递给带有 .setAttribute('layout', data) 的聚合物元素我如何通知聚合物的变化并让所有 child我的聚合物脚本更新的元素？

JSONobject看起来像这样

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 游戏来尝试掌握聚合物数据绑定原则，但似乎在哪些方面有所欠缺。

Answer 1

难道布局属性需要：

notify: true

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

我如何使用聚合物标记 JSON object 中的更改并从 javascript 传递数据然后渲染一些 child 元素

How do i flag a change in a JSON object using polymer and passing data from javascript then render some child elements

javascript

json

object

polymer

rerender