nativescript vue底部导航页面导航问题

时间:2020-03-21 21:18:02

标签: android ios nativescript nativescript-vue

index.vue

<template>
  <Page actionBarHidden="true">
    <BottomNavigation selectedIndex="0" @loaded="loaded">
      <!-- The bottom tab UI is created via TabStrip (the containier) and TabStripItem (for each tab)-->
      <TabStrip>
        <TabStripItem>
          <Label class="text" text="Ana Sayfa"></Label>
          <Image src="~/assets/images/home.png" class="fas t-36"></Image>
        </TabStripItem>
        <TabStripItem class="special">
          <Label class="text" text="Profil"></Label>
          <Image src="~/assets/images/profil.png" class="fas t-36"></Image>
        </TabStripItem>
      </TabStrip>

      <!-- The number of TabContentItem components should corespond to the number of TabStripItem components -->
      <TabContentItem>
        <Frame>
           <menu ></menu>
        </Frame>
      </TabContentItem>
      <TabContentItem>
        <Frame>
           <profil></profil>
        </Frame>
      </TabContentItem>
    </BottomNavigation>
  </Page>
</template>

<script>
import menu from "./menu";
import profil from "./profil";

export default {
  components: {
    menu,
    profil
  },
  data() {
    return {};
  },
  methods: {},
  created() {}
};
</script>

<style scoped>
.fas {
  font-family: "Font Awesome 5 Free", "fa-solid-900";
  font-weight: 900;
}

.t-36 {
  font-size: 36;
}

.text {
  font-size: 14px;
}
</style>

menu.vue

<template>
  <Page class="renk" @loaded="loaded">
    <ActionBar title="Profil">
      <NavigationButton text="Çıkış" android.systemIcon="ic_menu_close_clear_cancel" @tap="go"/>
      <!-- ic_menu_back -->
      <ActionItem
        ios.systemIcon="11"
        android.systemIcon="ic_menu_paste_holo_dark"
        ios.position="right"
      ></ActionItem>
    </ActionBar>
    <StackLayout></StackLayout>
  </Page>
</template>

<script>
import pages from "./pages";

export default {

  data() {
    return {};
  },
  methods: {
    go(){
       this.$navigateTo(pages);
    }
  },
  created() {}
};
</script>

<style scoped>
ActionBar {
  background-color: #53ba82;
  color: #ffffff;
}
</style>

我的问题样本;我想浏览页面。但不能导航。我在推

<menu></menu>

from bottomnavigate。然后我推送概要文件,然后页面就会出现。此导航无法稳定。我们可以认为此页面无效。我怎么解决这个问题............................................ ................................................... ................................................... ................................................... ..................................

0 个答案:

没有答案