运行 每次渲染时一个组件函数
Run a component function every time its rendered
我有一个 Ionic Angular 应用程序,它会在每次视图更改时调用 API 并将值存储在离子存储中。
每个页面都有一个 'header' 组件,应该从存储中显示该值。
在 ngOnInit(){}
中,我从存储中获取值并更新值。但是,每次页面视图只执行一次。因此,如果我查看主页,例如转到第 2 页,然后返回主页,代码将不会 re-execute.
我想这是因为当您更改视图时页面实际上并未卸载,因此没有理由 're-construct'。
constructor(){}
仅 运行 在该视图的第一个构造上
ngOnInit() {}
仅 运行 是该视图的第一个初始化
ionViewDidLoad() {}
没有 运行 因为它不是一个视图,而是一个离子页面生命周期挂钩
我基本上是在寻找一种调用 API 的方法,将值存储在离子存储中,并在每次页面更改时更新 header 中的值。
我一直认为这可能可以通过 Observables 实现,但我不确定这如何与离子存储一起工作。
或者甚至使用 ionic view 生命周期钩子之一从视图中的存储中获取值并将其作为 prop 传递到 header,但这看起来很乱。
我使用存储空间的原因是余额在其他地方使用,而不仅仅是在 header 中,如果它只在存储空间中可用,它可以节省我多次调用的时间。
感谢任何建议
export class HeaderComponent {
balance = 0.00;
constructor(
private storage: Storage,
) { }
async ngOnInit() {
this.storage.get('balance').then(data => {
this.balance = data;
});
}
}
如果您确定 HeaderComponent
中的 ngOninit
仅触发一次,则意味着它不会在路线更改之间被销毁。如果您的组件出现在您的所有视图中,那将是有意义的。
我不会使用本地存储将您的应用程序状态分发给您的应用程序组件。如果您的应用程序状态相对简单,那么可观察对象就是最佳选择。创建一个服务,将应用程序的状态保存在一个可观察的对象中。每次从 API 获取数据时,将新数据推送到可观察对象。然后在你的HeaderComponent
订阅ngOnInit
钩子中的observable,这样你的组件数据就可以在任何时候发生变化时自动同步到应用程序状态。
我有一个 Ionic Angular 应用程序,它会在每次视图更改时调用 API 并将值存储在离子存储中。
每个页面都有一个 'header' 组件,应该从存储中显示该值。
在 ngOnInit(){}
中,我从存储中获取值并更新值。但是,每次页面视图只执行一次。因此,如果我查看主页,例如转到第 2 页,然后返回主页,代码将不会 re-execute.
我想这是因为当您更改视图时页面实际上并未卸载,因此没有理由 're-construct'。
constructor(){}
仅 运行 在该视图的第一个构造上
ngOnInit() {}
仅 运行 是该视图的第一个初始化
ionViewDidLoad() {}
没有 运行 因为它不是一个视图,而是一个离子页面生命周期挂钩
我基本上是在寻找一种调用 API 的方法,将值存储在离子存储中,并在每次页面更改时更新 header 中的值。
我一直认为这可能可以通过 Observables 实现,但我不确定这如何与离子存储一起工作。
或者甚至使用 ionic view 生命周期钩子之一从视图中的存储中获取值并将其作为 prop 传递到 header,但这看起来很乱。
我使用存储空间的原因是余额在其他地方使用,而不仅仅是在 header 中,如果它只在存储空间中可用,它可以节省我多次调用的时间。
感谢任何建议
export class HeaderComponent {
balance = 0.00;
constructor(
private storage: Storage,
) { }
async ngOnInit() {
this.storage.get('balance').then(data => {
this.balance = data;
});
}
}
如果您确定 HeaderComponent
中的 ngOninit
仅触发一次,则意味着它不会在路线更改之间被销毁。如果您的组件出现在您的所有视图中,那将是有意义的。
我不会使用本地存储将您的应用程序状态分发给您的应用程序组件。如果您的应用程序状态相对简单,那么可观察对象就是最佳选择。创建一个服务,将应用程序的状态保存在一个可观察的对象中。每次从 API 获取数据时,将新数据推送到可观察对象。然后在你的HeaderComponent
订阅ngOnInit
钩子中的observable,这样你的组件数据就可以在任何时候发生变化时自动同步到应用程序状态。