Question

我尝试在两部不同的手机上使用Playground，但在其中任何一部手机上均无法使用，因此我尝试在此处共享代码。

我在main.js中初始化Vue：

import Vue from 'nativescript-vue';
import Login from './components/Login.vue';
import Main from './components/Main.vue';
import store from './store';

new Vue({
  store,
  render: h => h('frame', [h(store.state.is_logged_in ? Main : Login)]),
}).$start();

我的Login.vue看起来像这样：

<template>
  <page actionBarHidden="true">
    <ScrollView orientation="vertical">
      <GridLayout rows="2*,auto,3*" height="100%">
...
      </GridLayout>
    </ScrollView>
  </page>
</template>

<script>
import Main from './Main.vue';
  export default {
    name: 'Login',
    methods: {
      login() {
        this.$navigateTo(Main);
      },
    },
  };
</script>

我的Main.vue看起来像这样：

<template>
  <Page actionBarHidden="true">
    <StackLayout height="100%">
      <GridLayout height="7%" id="topBar" columns="*,*,*">
...
      </GridLayout>
      <StackLayout height="75%">
        <frame id="content">
          <home />
        </frame>
      </StackLayout>
      <navBar height="23%" />
    </stacklayout>
  </page>
</template>

<script>
  import navBar from './navBar.vue';
  import home from './home.vue';
  export default {
    name: 'Main',
    components: {navBar, home},
  };
</script>

home.vue看起来像这样：

<template>
  <page actionBarHidden="true">
    <ScrollView>
...
    </ScrollView>
  </page>
</template>

在我的navBar.vue中，我这样导航：

this.$navigateTo(page, {
  frame: 'content',
  props: props,
});

如果用户已经登录，因此Main.vue是第一个加载到根框架中的组件，则所有导航正常。但是，如果用户未登录。他们在登录后导航到主页，但是当我使用导航栏导航时，UI完全没有变化，但是在我的日志中，我看到导航实际上是在并正确渲染了正确的新页面，因为我收到了很多AppendChild，CreateElement等日志。但是，在主页上单击按钮时，我也打开了一些模态实体，其中一些实际上具有内部导航（在弹出窗口内），并且都可以正常工作。只是“内容”框架中的导航不起作用。

您知道如何解决此错误吗？

在nativescript-vue中混合全局导航和框架导航不起作用

0 个答案: