Question

在组件之间切换的最佳方法是什么？例如，我有一个仪表板组件和2个子组件。如何从仪表板切换到此组件？我找到了方法＆＃34; oComponentContainer.setContainer（＆＃34; componentId＆＃34;）;＆＃34;。

这是切换到另一个组件的正确方法吗？

Answer 1

我做了类似的事情

创建组件容器

this._oContainer = new ComponentContainer(this.createId("CONTAINTER"), {
            handleValidation: true
});
...

切换组件

var oComponent = this.getComponentById(sId, sRelativePathToComponent);
this._oContainer.setComponent(oComponent);

通过id检索现有组件或从路径创建新组件，注入依赖项，如模型或事件总线

getComponentById: function(sId, sCompName) {
    var oComponent = sap.ui.getCore().getComponent(sId);
    if (!oComponent) {
        oComponent = sap.ui.component({
            name: sCompName,
            id: sId,
            componentData: {
                model: this._oModel,
                eventBus: this._oComponent.getEventBus()
            }
        });
    }
    return oComponent;
}

Answer 2

我的解决方案类似于Jasper_07＆＃39。

在按下事件时切换到组件：

...onPressTile: function(oControlEvent){
        var comp = this.oView.oController.getComponent("dashboardCh", oControlEvent.getSource().data("componentName"));
        sap.ui.getCore().getEventBus().publish("dashboardCh", oControlEvent.getSource().data("componentName"));
    }...

组件处理程序功能：

/*
     * Component handler
     */
    getComponent: function(channel, componentName){
        var eventBus = sap.ui.getCore().getEventBus();

        if(!this.oView.oController.checkComponentExists(channel, componentName)){
            //create component
            var newComp = new sap.ui.getCore().createComponent({    
                name: componentName,
                id: componentName,
                height: "100%"
            });

            //subscripe component
            this.oView.oController.subscripeToEventBus(newComp, channel);
        };

    },

    checkComponentExists: function(_channel, _componentName){
        var componentExists = false;

        if(sap.ui.getCore().getEventBus()._mChannels.dashboardCh != undefined){
            if(_componentName in sap.ui.getCore().getEventBus()._mChannels.dashboardCh.mEventRegistry){
                componentExists = true;
            }
        }

        return componentExists;
    }, 

    subscripeToEventBus: function(newComp, _channel){
        sap.ui.getCore().getEventBus().subscribe(_channel, newComp.getId(), function(){
            sap.ui.getCore().getElementById("compContainer").setComponent(newComp.getId());
        }, this);
    }

SAPUI5交换机组件

2 个答案: