场景: 我们有一个部门人员机构功能, 页面时相同的, 当点击机构的时候,显示机构下的子机构, 再点击子机构的时候,显示机构下的人员.
机构-->子机构-->部门-->人员
如果这4个页面都相同,那么你会如何处理?
push-->push-->push?
如果这时候你跳了3个页面后, 选择了人员信息, 点击保存,想带到第一个页面, 怎么做?
pop? 你也是只能pop的上一级而已.
关键词: 单页面 + 重写返回方法
那么既然涉及到这几个页面都相同, 那么就用一个单页面去处理就好, 点击机构,这时候并不是真的push到了子机构, 而是 从新渲染当前页面的数据而已.
当触发了click 事件后,
didClick(){
在这个方法中我们别做Push. 而是去做请求,刷新你要展示的数据.
重点 : 在服务层创建一个数组, push你当前点击的这个组织机构id. 同时记录这个数组的length
}
第二步:
重写nav的返回方法.
import { ViewChild } from '@angular/core';
export class DetailPage {
@ViewChild(Navbar) navBar: Navbar;
}
ionViewDidLoad(){
this.navBar.backButtonClick = this.backButtonClick;
}
backButtonClick = (e: UIEvent) => { //这就是返回方法
点击返回. 先判断你push的那个数组的长度
if(arr.length==1){
证明你已经在第一层了,这时候点击返回的方法,就要触发
this.nav.pop;
}else{//此时单击返回, 就好像是从子机构返回到主机构,这时候要做的只是渲染刷新数据
此时.你拿到数组中的上一个元素,做请求. 请求完成后,把数组最后一个元素删除
}
}
通过这种方法, 即 单页面渲染刷新的方式加载显示相同的页面. 避免了多次Push 造成的无法返回到指定页面的问题.
