如何使用 `navigateBack` 将数据传回上一页？答案

【问题标题】：How do I pass data back to previous page using `navigateBack`?如何使用 `navigateBack` 将数据传回上一页？
【发布时间】：2020-12-21 08:29:40
【问题描述】：

我正在使用 navigateTo 打开带有 listview 的页面，并希望使用 navigateBack 将结果传回，但无法实现。有什么想法吗？

【问题讨论】：

这里有 Manoj 的答案，passing params on navigateBack
或者，您可以在 viewModel 中设置两个页面都可以访问的属性，然后在接收页面中，使用属性更新列表视图，然后使用 listview.refresh()。

标签： nativescript nativescript-vue

【解决方案1】：

借助 Service 类和 Observable，您可以实现这一点。

notify.service.ts

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs-compat/Subject';

@Injectable({
providedIn: 'root'
})
export class NotifyService {

private refreshDataForView = new Subject<any>();
refreshDataForParentViewObservable$ = this.refreshDataForView.asObservable();

public relaodDataForParentView(data: any) {
    if (data) {
    this.refreshDataForView.next(data);
    }
}
}

第二个组件.ts

  constructor(
    private notifyService: NotifyService
  ) {  }

  goBack() {
    this.notifyService.relaodDataForParentView({ data: 'any data you wanrt to pass here ' });
    this.router.back();
  }

第一个组件.ts

reloadDataSubscription: any;

constructor(
    private notifyService: NotifyService
) {}

ngOnInit() {
 this.reloadDataSubscription = this.notifyService.refreshDataForParentViewObservable$
 .subscribe((res) => {
    console.log('======', res);
    // do what you want to do with the data passed from second view
    });
}

【讨论】：

谢谢@Rajdeo Das。我最终做了一些与此类似的事情来实现它。但我认为应该有更好的方法在 nativescript 中执行此操作，而不是由我们自己处理。