我正在尝试在我的 NativeScript Vue 应用程序的模式中使用 navigateTo()。
我的模态组件被包裹在一个<Frame> 中，我知道如何让它成为一个导航控制器。但是，当我尝试导航到模态的子组件时，它实际上在主框架中的模态后面打开。
您可以在此处查看此行为：https://play.nativescript.org/?template=play-vue&id=azowAE&v=3
单击“打开模式”按钮，然后单击“显示子页面”按钮。看似什么都没有发生，但如果您随后单击“关闭”按钮，您将看到在模态后面打开的子页面。
【问题讨论】：
标签： nativescript nativescript-vue
为了导航到模式中使用的框架，您应该使用 $navigateTo 方法的第二个参数。这可以通过引用或 id 引用帧。我发现最简单的方法是给模态框的框架一个 id：
<Frame id="modal-frame">...</Frame>
然后您可以在模态框内导航，例如
this.$navigateTo(OtherComponent, {frame: 'modal-frame'});
注意，不要像 CSS 选择器那样在 ID 前面加上 #。只有 id 值。
【讨论】：
导致相同问题的另一个原因是模态导航到的子组件未包含在 <Page> 标记中。
当您在导航代码中添加 catch 时，它会给出以下错误，具体取决于您使用的是 ref 还是 id。
this.$navigateTo(NewModal, {
frame: "frame-id" // or "frame-ref"
}).catch(e => console.log(e));
“frame-ref”抛出TypeError: Cannot read property 'id' of undefined
“frame-id”抛出TypeError: backstackEntry.resolvedPage.onNavigatingTo is not a function
【讨论】：