UI5应用添加SimplePlanningCalendar报getKey错误如何解决？

该报错属于UI5动态聚合模板下子组件上下文绑定的常见问题，触发原因如下：

• 你将SinglePlanningCalendar放在了IconTabFilter的动态模板中，且IconTabBar的items绑定设置了templateShareable: true，开启了模板实例复用，多个标签页切换时组件的绑定上下文发生错乱
• SinglePlanningCalendar内部逻辑需要从视图实例对象上读取key属性，上下文错乱时拿到的是字符串类型的视图标识而非实例对象，调用getKey方法时就会抛出类型错误

按优先级依次尝试以下方案即可解决：

• 首先修改IconTabBar的items绑定配置，将templateShareable改为false，关闭模板复用，每个标签页生成独立的组件实例，避免上下文冲突
• 给SinglePlanningCalendar显式声明viewKey属性，指定默认使用的日历视图，比如按天视图就设为viewKey="Day"，覆盖组件内部自动取key的逻辑
• 若以上方案仍不生效，将SinglePlanningCalendar移到IconTabBar外部，监听IconTabBar的选中事件，切换日历的appointments绑定数据源，从根源避免动态模板下的实例复用问题

修改后的XML示例代码如下：

<IconTabBar xmlns="sap.m"
    id="idCategoryMenu"
    selectedKey="Home"
    headerMode="Inline"
    stretchContentHeight="true"
    applyContentPadding="false"
    select=".onSelectCategory"
    items="{
        path: 'backend>/CategorySet',
        parameters: {
            expand: 'Reports'
        },
        sorter: {
            path: 'Sort'
        },
        templateShareable: false
    }">
    <items>
        <IconTabFilter id="myIconTabFilter" key="{backend>Uuid}" text="{backend>Name}">
            <!-- ... -->
                <SinglePlanningCalendar viewKey="Day">
                    <appointments>
                        <unified:CalendarAppointment xmlns:unified="sap.ui.unified"
                            title="{title}"
                            startDate="{startDate}"
                            endDate="{endDate}"
                        />
                    </appointments>
                </SinglePlanningCalendar>
            <!-- ... -->
        </IconTabFilter>
    </items>
</IconTabBar>

内容的提问来源于stack exchange，提问作者Chris