单击第二个选项卡并返回时删除按钮

Question

我使用以下代码来显示简单按钮，当您单击选项卡 2 并 return 到旧选项卡时，按钮被删除，知道如何将它永久放置在选项卡 1 中吗？

这是控制器shell

onInit: function() {
      this.oViewBuffer ={};
      this.oViewBuffer.btn = sap.ui.jsview("codetalk.Main");
      var oShell = sap.ui.getCore().byId("main-shell");
      oShell.setContent(this.oViewBuffer.btn);
    },


    onWorksetItemSelected:function(oEvent){
        var oShell = sap.ui.getCore().byId("main-shell");
        var key = oEvent.getParameter("key");
        oShell.setContent(this.oViewBuffer[key]);

    }

这是 JS 视图

createContent : function(oController) {

        var oButton = new sap.ui.commons.Button({
            text:"Hello Test",
            tooltip:"This is toolTip",
            press:function(){
                alert("test alert");
            }

        });

        return oButton;

    }

这是shell

的观点

createContent : function(oController) {

        var oButton = new sap.ui.ux3.NavigationItem({
            key:"bth",
            text:"Tab 1"
        });
        var oMusicStore = new sap.ui.ux3.NavigationItem({
            key:"btn2",
            text:"Tab 2"
        });


        var oShell = new sap.ui.ux3.Shell({

            id:"main-shell",
            appTitle:"Demo",
            worksetItems:[oButton,oMusicStore],
            worksetItemSelected:[oController.onWorksetItemSelected,oController]
        });

        return oShell;
    }

Answer 1

在shell view.js中删除倒数第二行

示例

"worksetItemSelected:[oController.onWorksetItemSelected,oController]"

可能有用

Answer 2

首先，我建议您删除 shell ID (UI5 Dev Guide) 中的“-”，改用驼峰式大小写。

其次，您在 Init 函数中使用按钮调用视图，但一旦完成，您就可以使用控制器处理 worksetItems，并根据您的密钥设置 worksetItem。到目前为止，一切都很好。但是您的 worksetItems 与任何内容都没有关联，因此您的 shell 没有理由在您单击第一个 Tab

时向您显示该按钮

我建议使用 ID 初始化您的视图，并根据该 ID 在您的 shell 控制器中设置内容

示例：

var oViewButton = sap.ui.view("bth",{
    viewName : "codetalk.Main",
    type : sap.ui.core.mvc.ViewType.JS
)} //do that in your view where you define your Shell
//do the same for your view with the musicstore also in the view with the Shell  
//your id of the view must match the key of your worksetItem

在您的 shell 的控制器中执行此操作：

onWorksetItemSelected : function(oEvent){
    var oShell = sap.ui.getCore().byId("mainShell");
    var key = oEvent.getParameter("key");
    var oView = sap.ui.getCore().byId(key);
    oShell.setContent(oView);
}

此解决方案将绕过您 Shell 的内容聚合，但至少对我有用。

单击第二个选项卡并返回时删除按钮

Button remove when you click on second tab and back

sapui5