1

同样，我还是 Nativescript Vue 的新手。我已经努力通过 $navigateTo 使其工作，但放弃并改用 $showModal ......这就是我坚持的地方。我已经看到很少有 Nativescript Vue 用于移动应用程序的示例，但它仅显示以一种方式将数据传递给模态。

我想要做的是从中传递选定的项目：

AirportList 截图如下

来自 Airportlist.vue 的 AirportList 模态

并将所选项目放在“机场名称：”下（见下面的截图）

App.vue 中的自定义页面

你可以在https://github.com/stahlie/first-ns-app看到我的项目

这是我在代码中苦苦挣扎的地方

<CardView class="cardStyle" elevation="40" radius="10">
   <StackLayout class="cardContent"  > 
     <Label textWrap="true" text="Airport Name:"/>
     <TextField v-bind:text="SelectedAirportName" hint="Tap to Select" editable="false" @tap="onCustomItemTap"/>
    </StackLayout>
</CardView>

在脚本部分：

onCustomItemTap() {
  const newId = new Date().getTime();
  this.$showModal(AirportList, { props: { id : newId }, fullscreen: true });

},

在分区区域的 AirportList.vue 中

onAirportNameTap(args) {
 // const selectedairport
    alert(args.index + " " + args.item.faaID + " " +  args.item.airportName);
},

我只是坚持这一点，无法弄清楚如何将 args.item.faaID 和 args.item.airportName 传递回该 TextField 区域中的 App.vue ...您的输入将不胜感激。

4

1 回答 1

0

对于父子：您可以this.$emit("event", { key: 'value' })在您的模态函数中并通过在自定义元素标签上绑定来在onAirportNameTap()父级上监听它。:event="processEvent"

对于模态：https ://nativescript-vue.org/en/docs/routing/manual-routing/#returning-data-from-the-modal （似乎是最好的方法）。

希望能帮助到你。

于 2019-02-03T04:25:33.043 回答