javascript - SAPUI5 TreeTable 渲染问题

Question

我创建了一个具有一个 xml View 的案例。这个 View 包含一个有两列的树表

<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
        controllerName="sdf_test.App" xmlns:html="http://www.w3.org/1999/xhtml"
        xmlns:t="sap.ui.table" xmlns:var="sap.ui.comp.variants" xmlns:commons="sap.ui.commons"
        xmlns:layout="sap.ui.layout">
    <App>
        <pages>
            <Page>
                <content>
                    <t:TreeTable id="mainPageTable" rowHeight="40"
                        enableColumnReordering="false" visibleRowCount="14">
                        <t:columns>
                            <!-- <t:Column> <CheckBox /> </t:Column> -->
                            <t:Column sortProperty="landscapeName" width="400px">
                                <Label text="sample" />
                                <t:template>
                                    <Link text="{name}" enabled="{enabled}"/>
                                </t:template>
                            </t:Column>
                            <t:Column>
                                <Label text="Status" />
                                <t:template>
                                    <Text text="{nodeName}" />
                                </t:template>
                            </t:Column>
                        </t:columns>
                    </t:TreeTable>
                </content>
            </Page>
        </pages>
    </App>
</core:View>

我在 Controller 中填充这个树表，如下所示:

    onInit : function() {
                            var that = this;
                            var oView = that.getView();
                            var mainPageTable = oView.byId("mainPageTable");
                             var oData = {
                                        root:{
                                            0: {
                                                name: "item1",
                                                enabled: true,
                                                0: {
                                                    name: "subitem1-1",
                                                    enabled: true,
                                                },
                                                1: {
                                                    name: "subitem1-2",
                                                    enabled: false,
                                                }
                                            },  
                                        }
                                };
    var oModel = new sap.ui.model.json.JSONModel();
                            oModel.setData(oData);
                            mainPageTable.setModel(oModel);
                            mainPageTable.bindRows("/root");
        }
});

问题是我第一次打开“item1”根分支时，我可以看到一个项目已启用而第二个已禁用。但如果我关闭“item1”并再次打开它，两个字段都会被禁用。如下图所示。

第一次:

第二次:

Answer 1

好的，答案是对 treetable 使用 toggleOpenState 函数，然后在每次调用此方法时设置 rerender()。

<t:TreeTable toggleOpenState="toggleOpenState"/>


toggleOpenState : function(){

   this.byId("mainPageTable").rerender();
}