以编程方式创建nativescript-bottom元素

问题描述：

我希望能够设置nativescript-bottombar组件的selectedIndex。根据文档发现here, 我可以通过在底部栏上以编程方式设置它。但是，我很难理解我如何做到这一点。以编程方式创建nativescript-bottom元素

上的XML文件我初始化组件与

<btn:BottomBar class="bottom-tab-bar" tabSelected="tabSelected" titleState="1" items="{{items}}" inactiveColor="#9B9B9B" accentColor="#4955F6"></btn:BottomBar>

而在onPageLoaded事件中，我结合page.bindingContext到我的模型它可以对bottombar的项目。

export class AudibleModel extends Observable { 

    private _counter: number; 
    private _message: string;  
    private _bottomBar: BottomBar; 
    private _articles: ObservableArray<Article>; 

    public items: Array<BottomBarItem> = [ 
     new BottomBarItem(0, "Archive", "ic_archive_black", "#D8D8D8"), 
     new BottomBarItem(1, "My List", "ic_list_black", "#D8D8D8"), 
     new BottomBarItem(2, "Account", "ic_account_circle_black", "#D8D8D8") 
    ]; 

    constructor() { 
     super(); 
     this._bottomBar.items = this.items; 

     this._articles = 

      new ObservableArray([]); 


    } 

    get articles(): ObservableArray<Article> {  
     return this._articles; 
    } 
}

我不知道如何将视图和视图模型链接在一起，以便我可以在此处创建组件。如何以编程方式创建/修改组件，以便我可以设置selectedIndex属性？

答

没有完全的答案，但一个可能的解决方案似乎是它添加到后面的代码：

export function tabLoaded(args) { 
    let _bar = args.object as BottomBar; 
    _bar.selectItem(1); 
}

和XML元素本身：

<btn:BottomBar class="bottom-tab-bar" loaded="tabLoaded" titleState="1" items="{{items}}" inactiveColor="#9B9B9B" accentColor="#4955F6"></btn:BottomBar>

以编程方式创建nativescript-bottom元素

相关推荐