嵌套的 nativescript tabview 操作栏

Question

我有 4 个选项卡，每个选项卡中的 "navigation" 使用 router-outlet。我想问您是否可以为每个选项卡创建不同的操作栏，以及您是否可以在选项卡内导航同时更改标题和操作栏的项目

Answer 1

您无法为每个选项卡保留单独的操作栏，但您可以尝试在切换选项卡时更新操作栏。

Answer 2

我通过为四个选项卡的每个组件创建一个操作栏并根据所选选项卡在所需选项卡中导航来解决，示例：

public onIndexChanged(args) {
    let tabView = <TabView>args.object;
    if(tabView.selectedIndex == 0){
        this.title = this.test;
        this.routerExtensions.navigate(['tabs',
            {
                outlets: {'test': ['test'],
            }
        }], { 
            clearHistory: true 
         });
    }
    else if(tabView.selectedIndex == 1){
        this.title = this.test1;
        this.routerExtensions.navigate(['tabs',
            {
                outlets: {'test1': ['test1'],
            }
        }], { clearHistory: true });
    }
    else if(tabView.selectedIndex == 2){
        this.title = this.test2;
        this.routerExtensions.navigate(['tabs',
            {
                outlets: {'test2': ['test2'],
            }
        }], { clearHistory: true });
    }
    else if(tabView.selectedIndex == 3){
        this.title = this.notifications;
        this.routerExtensions.navigate(['tabs',
            {
                outlets: {'test3': ['test3'],
            }
        }], { clearHistory: true });
    }
    else if(tabView.selectedIndex == 4){
        this.title = this.settings;
        this.routerExtensions.navigate(['tabs',
            {
                outlets: {'test4': ['test4'],
            }
        }], { clearHistory: true });
    }
}

然后在每个选项卡中我都有其他视图和其他操作栏。更改选项卡时，历史记录被取消，所以如果我返回到之前打开的选项卡，它会被重新创建，然后操作栏会再次更新。

我发现的唯一问题（我认为这是一个错误）是（在 android 上）删除 router-outlet 的历史记录不起作用。

编辑

我必须传递一个随机参数以允许我要离开的组件调用 OnDestroy 方法，这样当我 return 到我离开它的选项卡时，它会重新创建所有内容，包括操作栏

this.routerExtensions.navigate(['tabs',
        {
          parameterForOnDestroy: true
        },
        {
            outlets: {'test': ['test'],
        }
    }], { 
        clearHistory: true 
     });

嵌套的 nativescript tabview 操作栏

nativescript tabview actionbar nested

navigation

nested

tabview

android-actionbar

nativescript