Question

我目前在另一个铁列表中有一个铁列表。父数据来自firebase-query元素，并且从每个父项计算子数据。 db结构和代码看起来有点像这样：

DB: [
     category1: [
                 itemId1: {
                           price: 10,
                           title: "title" 
                          }
                ]
    ]



<iron-list id="categoryList" items="{{categories}}" multi-selection as="category">
        <template>
            <div class="category-holder">
                <iron-list id="{{category.$key}}" items="{{_removeExtraIndex(category)}}" as="item" selection-enabled multi-selection selected-items="{{selectedItems}}" grid>
                    <template>
                        <div class$="{{_computeItemClass(selected)}}">
                            <p>[[item.title]]</p>
                            <p>[[item.price]]</p>
                        </div>
                    </template>
                </iron-list>
            </div>
        </template>
    </iron-list>

在选择任意数量的项目后，用户可以点击工厂批量编辑价格。这是我遇到问题的地方。我无法弄清楚如何访问正确的子铁列表以便调用list.set ...我目前正在尝试以下非常讨厌的方法：

var categories = this.$.categoryList;
var categoryItems = categories.items;

(this.selectedItems).forEach(function(item) {
    var index = item.itemId;
    categoryItems.forEach(function(itemList, categoryIndex) {
    if (itemList[index]) {
         categories.set('item.' + categoryIndex + '.price', 10);
         }
    }, this);
}, this);

我迭代所选项目以提取项目索引，然后迭代父铁列表数据（categoryItems），以检查给定项目是否存在于该数据子集中。如果是这样，那么我使用类别索引并尝试使用给定路径调用父铁列表上的set来访问我想要编辑的实际项目。正如所料，这失败了。希望我已经足够清楚了，任何帮助都会受到赞赏！

编辑＃1：

经过多次试验，我终于想出了如何正确改变孩子的铁列表：

(this.selectedItems).forEach(function(item) {
                var list = this.$.categoryList.querySelector('#' + item.category);
                var index = list.items.indexOf(item);
                list.set(["items", index, "price"], 30);                   
            }, this);

值得注意的一些事情。我使用querySelector而不是推荐的。$$（选择器）因为我一直在运行一个＆＃34;函数DNE＆＃34;错误。但是现在我有另一个问题......在调用函数之后，值得到了正确的更新，但是我得到了以下错误：

Uncaught TypeError: inst.dispatchEvent is not a function

这是完整错误消息的图片：

我看到了光明，希望有人可以帮助我！

Answer 1

好的，我会考虑一下这个。我认为会发生以下情况，我想这是基于dom-repeat的工作方式：

  var categories = this.$.categoryList;
  var categoryItems = categories.items;

你接受了铁列表所基于的变量，但是将一个数组设置为另一个只是在javascript中创建一个引用。只要更新 categoryItems ，您也会更新此。$ .categoryList.items。当您稍后设置新值时，iron-list将执行脏检查并比较所有子属性，并且因为它们相等（因为...引用），铁列表不会更新dom。

你应该做的是确保它是一个全新的副本，这样做的方法是使用 JSON.parse（JSON.stringify（myArray））。

此外，我在您的代码中看到的一个主要缺陷是您使用querySelector选择一个元素，然后操纵它。你应该做的是使用this.categories而只使用那个变量。

所以你的方法应该是这样的：

  // Get a freshly new array to manipulate
  var category = JSON.parse(JSON.stringify(this.categories);

  // Loop through it
  category.forEach(category) {
    // update your categoryList variable
  }

  // Update the iron list by notifying Polymer that categories has changed.
  this.set('categories', category);

阵列中的变异数组（聚合物铁列表）

1 个答案: