JZTXT

Angular系列 -> 生命周期钩子

发布时间 2023-04-23 15:59:07作者: 77工作室

简介：

Angular 指令的生命周期，是用来记录指令从创建、应用及销毁的过程。Angular 提供了一系列与指令生命周期相关的钩子，便于我们监控指令生命周期的变化，并执行相关的操作。

生命周期介绍: 

  1. ngOnChanges:
    当数据绑定输入属性的值发生变化时;
    @input属性(输入属性)发生变化时;
  2. ngOnInit
    在第一次 ngOnChanges 后调用
  3. ngDoCheck
    自定义的方法，用于检测和处理值的改变
  4. ngAfterContentInit
     在组件内容初始化之后调用
  5. ngAfterContentChecked
    组件每次检查内容时调用
  6. ngAfterViewInit
     组件相应的视图初始化之后调用
  7. ngAfterViewChecked
    组件每次检查视图时调用
  8. ngOnDestroy
    指令销毁前调用
【注】不要在视图钩子中改变数据（因为会导致循环调用），违反单向数据流。 要改用setTimeout，使得在下一轮JS 开始执行的时候触发

参考链接：https://juejin.cn/post/6844903933459038215