Nativescript从代码更改底部导航选项卡

时间:2020-02-23 07:38:59

标签: nativescript bottomnavigationview

我想更改BottomNavigation的活动选项卡,我知道我可以使用它

bottomNav.selectedIndex = 0;

问题正在定义bottomNav。这是应用程序的结构

应用程序根

<Frame defaultPage="login/login-page"></Frame>

登录页面转到包含底部导航的路由器页面

<Page actionBarHidden="true" xmlns="http://schemas.nativescript.org/tns.xsd">
    <BottomNavigation id="bottomNav" selectedIndex="2">
        ...
        <TabContentItem>
            <Frame id="main" defaultPage="categories/categories-page"></Frame> //I want to be here
        </TabContentItem>
        <TabContentItem>
            <Frame id="gallery" defaultPage="gallery/gallery-page"></Frame>
        </TabContentItem>
        <TabContentItem>
            <Frame id="profile" defaultPage="profile/profile-page"></Frame> //I'm here
        </TabContentItem>
    </BottomNavigation>
</Page>

在个人资料页面中,我有一个按钮可以切换到主机,但我不能这样做

exports.viewProduct = function(args){
    const product = args.object.pid,
    productFrame = Frame.getFrameById('main'),
    bottomNav = Frame.topmost().getViewById('bottomNav'); //undefined

    bottomNav.selectedIndex = 0;
    productFrame.navigate({
    moduleName: 'product/product-page',
        context: { id: product }
    });
}

1 个答案:

答案 0 :(得分:0)

您是否检查了Frame.topmost()正在返回哪个帧?我相信它应该返回profile帧,因为它在给定的时间点位于顶部。您应该在此处通过ID调用框架,

XML

<Frame id="root" defaultPage="login/login-page"></Frame>

JS

Frame.getFrameById('root').getViewById('bottomNav') // should do the job