【问题标题】:NativeScript Change Selected Tab in TabViewNativeScript 更改 TabView 中的选定选项卡
【发布时间】:2017-08-13 09:09:30
【问题描述】:

我似乎无法找到如何通过部分视图中的代码导航到 tabView 中的不同选项卡(每个选项卡都位于具有自己的 html/ts/js/css 文件的子文件夹中)。 此场景中的特定用例是,当用户单击列表中的某个项目时,它应该切换到另一个选项卡,并传递上下文(项目数据)。

我可以使用以下方法更改父文件中选定的选项卡:

export function nav()
{
    pageData.set("tabIndex", 2);
}

但是我不知道如何从子文档中设置它或如何将数据传递到不同的局部视图

我正在使用部分视图来创建选项卡,部分视图只是堆栈布局,因此我的带有选项卡视图的页面如下所示:

<TabView selectedIndex="{{tabIndex}}" >
 <TabView.items>
  <TabViewItem title="Drop Sequence">
    <TabViewItem.view>
      <DropSequence:DropSequence />
    </TabViewItem.view>
  </TabViewItem>

  <TabViewItem title="Edit Order" >
    <TabViewItem.view>
      <EditOrder:EditOrder />
    </TabViewItem.view>
  </TabViewItem>

【问题讨论】:

    标签: typescript navigation nativescript


    【解决方案1】:

    我通常使用 NativeScript-Angular,据我了解,这是一种 Angular 的做法。

    首先,添加一个TabView TabView id="tabview1" 的id,然后写如下:

    var tabview1 = page.getViewById("tabview1");
    tabview1.selectedIndex = 1;
    

    【讨论】:

    • 我必须将其转换为相应的Type,否则cli会将tabview1识别为Viewbase并打印错误。所以我的代码看起来像这样。 var tabview1 = this._page.getViewById("tabview1"); tabview1.selectedIndex = 1;