Question

在Javascript Nativescript应用程序中有一个关于导航逻辑的快速问题。

许多应用程序似乎将导航绑定到视图js文件。我正在制作的应用程序在JS文件之间共享了很多这种导航，我正在寻找一种方法来减少我正在使用的可重复代码的数量。

我知道Angular有路由器可以处理这个问题，但我想知道是否可以使用Javascript Nativescript将所有导航逻辑包含在一个文件中。

目前我正在这样导航： -

xml：

<Label text=“Navigation Label" tap="navigate" />

JS：

var frameModule = require("ui/frame");
function navigationOptions(moduleVar) {
 frameModule.topmost().navigate({
   moduleName: moduleVar,
   transition: { name: "fade" },
   backstackVisible: false,
   clearHistory: true
 });
}

exports.navigate = function(args) {
 navigationOptions("views/catalog/catalog");
}

此刻必须在每个文件夹中重复使用JS，我只是想找到一种方法来整理我的代码，你是否有我可以找到的建议或资源来帮助解决这个问题？

Answer 1

由于Nikolay提供并由TJ创建的资源，我找到了解决方案： https://github.com/NativeScript/sample-Groceries/blob/javascript/app/shared/navigation.js

首先在共享文件夹中创建一个navigation.js文件：

应用/共享/ navigation.js

var frameModule = require("ui/frame"); var drawer; module.exports = { /* Settings navigation */ goToSettingsPage: function() { frameModule.topmost().navigate({ moduleName: "views/settings/settings", transition: { name: "fade" }, // <-- This line backstackVisible: false, }); },

然后您需要在视图js文件中调用js文件：

应用/视图/ dashboard.js

var navigation = require("../../shared/navigation");

您还需要调用navigation.js中设置的功能

exports.goToSettingsPage = navigation.goToSettingsPage;

然后你可以简单地在所需的组件上调用该函数。

tap="goToSettingsPage"

我仍然没有100％因为你必须打电话给每个导航功能，但它确实比我以前更好。

Nativescript导航逻辑

1 个答案: