如何在本机脚本中导航另一个页面？答案

【问题标题】：How to navigate another page in native-script?如何在本机脚本中导航另一个页面？
【发布时间】：2020-06-22 18:12:32
【问题描述】：

我正在尝试在本机脚本上创建一个名为“登录”的简单按钮。我已经创建了一个登录组件，但是当我测试代码时它说没有已知的元素登录组件。

<template>
<Page>
    <TabView height="100%" />
    <ActionBar title="Home" />
    <ScrollView>
        <StackLayout class="home-panel">
            <!--Add your page content here-->
            <Label textWrap="true" text="Play with NativeScript!"
                class="h2 description-label" />
            <Button text="Login" @tap="onLoginTap" />
            <Login>
        </StackLayout>
    </ScrollView>
    </TabView>
</Page>
</template>

<script>
import Login from "./login";
export default {
    data() {
        return {};
    };
},
methods: {
    onLoginTap: function() {
        this.$navigateTo(Login);
    });
</script>

【问题讨论】：

您的代码看起来很分散，方法是在导出之外编写的/我不明白为什么您有自关闭 TabView 和另一个单独挂在模板底部的关闭标签。请分享一个完整整洁的代码，可能是 Playground 示例。
请你看看这里的代码：play.nativescript.org/?template=play-vue&id=CxNnsM&v=7

标签： javascript vue.js nativescript native nativescript-vue

【解决方案1】：

您的代码中存在各种问题

您只能在 Page 之间导航，您的登录组件没有被 Page 元素包裹
我不确定您为什么使用 TabView，它仅在您有选项卡式应用程序并且存在特定组件层次结构时使用。有关详细信息，请参阅文档。我已将其删除，因为您的主页似乎不需要它
您不应该将登录作为标签嵌入到同一页面中

总的来说，我建议您阅读文档的基础知识以避免此类问题。

Updated Playground

【讨论】：

v-template 用于 ListView。正如我已经说过的，不要随意使用某些东西。在使用之前尝试理解元素的含义。
我最初使用列表视图，但后来摆脱了它并忘记摆脱 v-template。但这就是我的按钮不起作用的原因吗？
我已经提过很多次了，请关注文档，不要假设属性/事物存在。 ListView 不是 v-for，它只是 for。它不需要或没有关键属性。还有filteredClassses计算函数坏了，在访问它之前确保对象是有效的。
不，这不是 nativescript 问题，而是您的代码。到目前为止，我可以说，当我检查时，您的 API 端点也总是无效的。所以我不能在那里发表太多评论。
检查filteredClasses的长度，它总是0。