Polymer 中的嵌套数组观察

Question

我有点复杂属性我想在 Polymer 中观察。

属性包含 嵌套的 数组，这些数组似乎不支持使用 observers 进行观察，因为它们似乎只能与 1 一起干净地工作-嵌套级别（即道具中只有一个数组）。

举个例子：

  Polymer({
    is: 'house-component',

    properties: {

      house: {
        type: Object,
        value: {
          parents: [
            {
              name: "BigFoo",
              children: [
                { name: "SmallFoo", age: 12 },
                { name: "SmallBaz", age: 15 },
                { name: "SmallSid", age: 17 }
              ]
            },
            {
              name: "BigBaz",
              children: [
                { name: "SmallIda", age: 11 },
                { name: "SmallTed", age: 18 },
                { name: "SmallMoe", age: 16 }
              ]
            }
          ]
        }
      }
    }

我将如何专门监控以下操作（仅示例）：

任意 child.
addition/removals 共 children for any parent.

理想情况下，我可以按照这些思路做一些事情：

    observers: [
      "_childAgeChanged(house.parents.*.children.*.age)",
      "_childrenChanged(house.parents.*.children)"
    ],

这是我目前使用的：

    observers: [
      "_childrenChanged(house.parents.*)" // basically observes almost everything
    ],

这也为我提供了所有对 parent 的更改。

为了解决我目前使用的问题，我在 changeRecord 的 path 上做了很多 string-matching 以查看实际更改了哪条路径以及如何更改，但是它看起来非常可怕。

有没有更好的方法来解决这个问题而不改变我正在使用的数据结构？

Answer 1

这里没有灵丹妙药，通配符只能用在路径的末尾，所以最好的办法就是你正在做的事情——指定 house.parents.* 并过滤 path.

我敢肯定还有其他方法可以做到这一点，但如果您在观察者中使用一对正则表达式也不错：

var splicesRe = /house\.parents\.([^.]*)\.children\.splices/
var ageRe = /house\.parents\.([^.]*)\.children\.([^.]*)\.age/

var match;
match = change.path.match(splicesRe);
if (match) {
    var parentKey = match[1];
    childrenChanged(parentKey, change);
}
else {
    match = change.path.match(ageRe);
    if (match) {
        var parentKey = match[1];
        var childKey = match[2];
        var newAge = change.value;
        childAgeChanged(parentKey, childKey, change.value);
    }
}

（可以更紧凑；我添加了命名变量以阐明匹配组的内容。）

Polymer 中的嵌套数组观察

Nested array observation in Polymer

javascript

polymer

polymer-1.0