Question

我有一个集合视图。我分开时操纵物品。所以常见的工作流程看起来像这样：

所有图标都是这样的

<svg viewBox="0 0 32 32"><use xlink:href="img/icons.svg#trash"></use></svg>

分离或删除所有项目：

_.forOwn(this._v, function (view, key, _v) {
    view.detach();
    if (!collection.get(key)) {
        delete _v[key];
    }
});

追加现有或创建新项目。

var frag = document.createDocumentFragment();
this.collection.each(function (model) {
    var item;
    if (view._v.hasOwnProperty(model.cid)) {
        item = view._v[model.cid];
    } else if (!isFiltered || (isFiltered && view.collectionFilter(model))) {
        item = view._v[model.cid] = $(view.itemTemplate(model.toJSON()));
    }
    frag.appendChild(item[0]);
});
this.container.html(frag);

但之后。我翻过奇怪的图片：图标只显示在新创建的项目上。但在其他人看来他们没有。

我想这是因为#shadow内容没有重新加载。我看到SVG在shadow DOM中显示。有人知道如何解决这个问题吗？例如，手动重新加载阴影部分？

DOM Element分离后不显示SVG

0 个答案: