Polymer Vaadin cache.js

我正在尝试使用复选框构建treeSelectView。 它实现了HasValue，因此

setValue

将移交一个应该选中复选框的节点列表。无论何时调用函数，都会选中这些复选框。下面是下降部分。当treeSelectView到达客户端时，一个名为

https://localhost:8443/VAADIN/static/client/client-调用BF4676DDAFDA5E40AE93EFEB692AAD5.cache.js

，将树中的所有复选框设置为未选中。这是注销输出：

Sending xhr message to server: {"csrfToken":"8eb266a3-ec2b-4238-9d2e-00da55a02c27","rpc":[{"type":"mSync","node":313,"feature":1,"property":"selected","value":false},{"type":"mSync","node":307,"feature":1,"property":"selected","value":false},{"type":"mSync","node":301,"feature":1,"property":"selected","value":false},{"type":"mSync","node":295,"feature":1,"property":"selected","value":false},{"type":"mSync","node":289,"feature":1,"property":"selected","value":false},{"type":"mSync","node":283,"feature":1,"property":"selected","value":false},{"type":"mSync","node":277,"feature":1,"property":"selected","value":false},{"type":"mSync","node":271,"feature":1,"property":"selected","value":false},{"type":"mSync","node":265,"feature":1,"property":"selected","value":false},{"type":"mSync","node":259,"feature":1,"property":"selected","value":false},{"type":"mSync","node":253,"feature":1,"property":"selected","value":false},{"type":"mSync","node":247,"feature":1,"property":"selected","value":false},{"type":"mSync","node":241,"feature":1,"property":"selected","value":false},{"type":"mSync","node":235,"feature":1,"property":"selected","value":false},{"type":"mSync","node":229,"feature":1,"property":"selected","value":false},{"type":"mSync","node":223,"feature":1,"property":"selected","value":false},{"type":"mSync","node":217,"feature":1,"property":"selected","value":false},{"type":"mSync","node":211,"feature":1,"property":"selected","value":false},{"type":"mSync","node":205,"feature":1,"property":"selected","value":false},{"type":"mSync","node":199,"feature":1,"property":"selected","value":false},{"type":"mSync","node":193,"feature":1,"property":"selected","value":false},{"type":"mSync","node":187,"feature":1,"property":"selected","value":false},{"type":"mSync","node":181,"feature":1,"property":"selected","value":false},{"type":"mSync","node":175,"feature":1,"property":"selected","value":false},{"type":"mSync","node":169,"feature":1,"property":"selected","value":false},{"type":"mSync","node":163,"feature":1,"property":"selected","value":false},{"type":"mSync","node":157,"feature":1,"property":"selected","value":false},{"type":"mSync","node":151,"feature":1,"property":"selected","value":false},{"type":"mSync","node":145,"feature":1,"property":"selected","value":false},{"type":"mSync","node":139,"feature":1,"property":"selected","value":false},{"type":"mSync","node":133,"feature":1,"property":"selected","value":false},{"type":"mSync","node":127,"feature":1,"property":"selected","value":false},{"type":"mSync","node":121,"feature":1,"property":"selected","value":false},{"type":"mSync","node":115,"feature":1,"property":"selected","value":false},{"type":"mSync","node":109,"feature":1,"property":"selected","value":false},{"type":"mSync","node":103,"feature":1,"property":"selected","value":false},{"type":"mSync","node":97,"feature":1,"property":"selected","value":false},{"type":"mSync","node":91,"feature":1,"property":"selected","value":false},{"type":"mSync","node":85,"feature":1,"property":"selected","value":false},{"type":"mSync","node":79,"feature":1,"property":"selected","value":false},{"type":"mSync","node":73,"feature":1,"property":"selected","value":false},{"type":"mSync","node":67,"feature":1,"property":"selected","value":false},{"type":"mSync","node":61,"feature":1,"property":"selected","value":false},{"type":"mSync","node":55,"feature":1,"property":"selected","value":false},{"type":"mSync","node":49,"feature":1,"property":"selected","value":false},{"type":"mSync","node":43,"feature":1,"property":"selected","value":false},{"type":"mSync","node":37,"feature":1,"property":"selected","value":false},{"type":"mSync","node":31,"feature":1,"property":"selected","value":false},{"type":"mSync","node":25,"feature":1,"property":"selected","value":false},{"type":"mSync","node":19,"feature":1,"property":"selected","value":false}],"syncId":1,"clientId":1}

这是完全出乎意料和不想要的行为。 有谁能告诉我为什么会这样

更新

这是我的树选择项：

    <link rel="import" href="../../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../../bower_components/vaadin-checkbox/src/vaadin-checkbox.html">
<link rel="import" href="../../../bower_components/vaadin-button/src/vaadin-button.html">
<dom-module id="tree-select-item">
<template>
    <style>
        #currentItemContainer{
            background-color: var(--lumo-contrast-10pct);
            border-radius: var(--lumo-border-radius);
            padding: 5px;
            margin: 3px;
            overflow: auto;
        }
        .hidden{
            display: none;
        }

    </style>
    <div id="currentItemContainer" style$="{{_getStyle(level)}}" class$="{{_isHidden(hidden)}}">
        <div style="width: 90px; float: left">
            <vaadin-checkbox id="checkbox" checked="{{selected}}" indeterminate="{{indeterminate}}" disabled="{{readOnly}}"></vaadin-checkbox>
            <vaadin-button class$="{{_isToggleHidden(hasDescendents)}}" theme="icon" on-click="collapse" style="--lumo-button-size: var(--lumo-size-xs);">
                <iron-icon icon="{{_getCollapseToggle(collapsed)}}" slot="prefix"></iron-icon>
            </vaadin-button>
        </div>
        <div id="layout" float: left></div>
    </div>
</template>
  <script>
    {
      class TreeSelectItem extends Polymer.Element {
        static get is() {
          return 'tree-select-item';
        }
     /*    collapse(){
            this.collapsed = !this.collapsed;
            var parentElement = this.parentNode.__dataHost;
            parentElement.collapse(this.id,this.collapsed);
        } */
        _getCollapseToggle(collapsed){
            return collapsed ? "lumo:angle-right" : "lumo:angle-down";
        }
        _isToggleHidden(hidden){
            return !hidden ? "hidden" : "";
        }
        _isHidden(hidden){
            return hidden ? "hidden" : "";
        }
        _getStyle(marginFactor){
            return "margin-left:"+(20*marginFactor)+"px;";
        }
      }
      window.customElements.define(TreeSelectItem.is, TreeSelectItem);
    }
  </script>
</dom-module>

#currentItemContainer{
背景色：var（--lumo-contrast-10pct）；
边界半径：var（--lumo边界半径）；
填充物：5px；
保证金：3倍；
溢出：自动；
}
.隐藏{
显示：无；
}
{
类TreeSelectItem扩展了Polymer.Element{
静态get是（）{
返回“树选择项”；
}
/*崩溃（）{
this.collapsed=！this.collapsed；
var parentElement=this.parentNode.\uuu dataHost；
parentElement.collapse（this.id，this.collapse）；
} */
_getCollapseToggle（折叠）{
返回折叠？“lumo:角度向右”：“lumo:角度向下”；
}
_iStogleHidden（隐藏）{
返回！隐藏？“隐藏”：“；
}
_伊希登（隐藏）{
返回隐藏？“隐藏”：“；
}
_getStyle（marginFactor）{
返回“左边距：”+（20*marginFactor）+“px；”；
}
}
define（TreeSelectItem.is，TreeSelectItem）；
}

这里是java部分

    @Data
@Tag("tree-select-item")
@HtmlImport("base/template/component/tree-select-item.html")
public class TreeSelectItem<T extends BasicTreeObject<T>> extends PolymerTemplate<TreeSelectItemTemplateModel> {
    /**
     * The element containing this item
     */
    private TreeSelect<T> treeSelect;
    private T item;
    @Id("layout")
    private Div layout;
    @Id("checkbox")
    private Checkbox checkbox;

    public TreeSelectItem(T item, TreeSelect<T> treeSelect) {
        setCollapsed(false);
        setSelected(false);
        getModel().setLevel(item.getLevel());
        getModel().setId(item.getId().intValue());
        getModel().setHasDescendents(CollectionUtils.isNotEmpty(item.getChildren()));
        getModel().setHidden(false);
        getModel().setReadOnly(false);
        this.treeSelect = treeSelect;
        this.item = item;
        render();
    }

    public void render() {
        layout.removeAll();
        Component label = treeSelect.getItemRenderer().createComponent(item);
        layout.add(label);
    }

    @EventHandler
    public void collapse() {
        treeSelect.collapse(this);
    }

    public void setCollapsed(boolean collapsed) {
        getModel().setCollapsed(collapsed);
    }

    public boolean isCollapsed() {
        return getModel().isCollapsed();
    }

    public void setSelected(boolean selected) {
        setIndeterminate(false);
        getModel().setSelected(selected);
    }

    public boolean isSelected() {
        return getModel().isSelected();
    }

    public void addSelectionListener(PropertyChangeListener listener) {
        getElement().addPropertyChangeListener("selected", listener);
    }

    public void setHidden(boolean hidden) {
        getModel().setHidden(hidden);
    }

    public void setIndeterminate(boolean indeterminate) {
        getModel().setIndeterminate(indeterminate);
    }

    public void setReadOnly(boolean readOnly) {
        getModel().setReadOnly(readOnly);
    }

    public String toString() {
        return this.item.toString();
    }
}

@数据
@标记（“树选择项”）
@HtmlImport（“base/template/component/tree select item.html”）
公共类树选择项扩展了PolymerTemplate{
/**
*包含此项的元素
*/
私有树选择树选择；
私人物品；
@Id（“布局”）
私人分区的布局；
@Id（“复选框”）
私有复选框；
公共树选择项（T项，树选择树选择）{
设置崩溃（假）；
已选择（假）；
getModel（）.setLevel（item.getLevel（））；
getModel（）.setId（item.getId（）.intValue（））；
getModel（）.setHasDescents（CollectionUtils.isNotEmpty（item.getChildren（））；
getModel（）.setHidden（false）；
getModel（）.setReadOnly（false）；
this.treeSelect=treeSelect；
this.item=项目；
render（）；
}
公共无效呈现（）{
layout.removeAll（）；
组件标签=treeSelect.getItemRenderer（）.createComponent（项）；
布局。添加（标签）；
}
@事件处理程序
公共空间崩溃（）{
树选择。崩溃（这个）；
}
公共空集合折叠（布尔折叠）{
getModel（）.setCollapsed（折叠）；
}
公共布尔值isCollapsed（）{
返回getModel（）.isCollapsed（）；
}
已选择公共无效设置（已选择布尔值）{
setUndeterminate（假）；
getModel（）.setSelected（已选择）；
}
公选{
返回getModel（）.isSelected（）；
}
public void addSelectionListener（PropertyChangeListener侦听器）{
getElement（）.addPropertyChangeListener（“选定”，listener）；
}
公共void setHidden（布尔隐藏）{
getModel（）.setHidden（隐藏）；
}
公共无效集合不确定（布尔不确定）{
getModel（）.setUndeterminate（不确定）；
}
public void setReadOnly（布尔只读）{
getModel（）.setReadOnly（只读）；
}
公共字符串toString（）{
返回此.item.toString（）；
}
}

下面是设置值的函数：

@Override
    public void setValue(List<T> value) {
        for (TreeSelectItem<T> tsi : this.treeSelectItems) {
            tsi.setSelected(value.contains(tsi.getItem()));
        }
        updateParentNodesCheckbox();
    }

@覆盖
公共无效设置值（列表值）{
for（TreeSelectItem tsi:this.treeSelectItems）{
setSelected（value.contains（tsi.getItem（））；
}
UpdateParentNodeCheckBox（）；
}

请添加您的相关代码。@SteffenHarbich我会的，但正如我告诉您的，我的代码工作正常。我调试了它。我要检查的所有复选框都被检查，直到它们到达cilenside为止。然后

client-BF4676DDAFDA5E40AE93EFEB692AAAD5.cache.js启动并取消选中所有选项。那剧本不是我写的。它似乎是由瓦丁产生的。