0

我构建了一个名为“gw-responsive-tabs”的组件，该组件具有一个带有变量（navLinks）的输入，该变量是我要显示的选项卡的数组。当我像这样从 html 传递输入数据时：

<gw-responsive-tabs
  [navLinks]="[{ label: 'PENDING', path: '/mentoring/manage/pending' },
  { label: 'CURRENT', path: '/mentoring/manage/pending' }]">
</gw-responsive-tabs>

然后一切都按预期工作，我可以看到 2 个选项卡。

如果我更改它并使用 getter 或函数发送相同的数据，那么 gw-responsive-tabs 组件的 ngOnChanges 会以非常高的频率不间断地触发，并且从那时起，chrome 没有响应。

get mentoringTabs(): Array<any> {
  return [{ label: 'PENDING', path: '/mentoring/manage/pending' }, { label: 'CURRENT', path: '/mentoring/manage/pending' }];
}

和html：

<gw-responsive-tabs [navLinks]="mentoringTabs"></gw-responsive-tabs>

有什么想法会导致这种现象吗？

4

1 回答 1

0

这是因为更改检测默认策略每隔几秒左右检查一次无论返回对象的值是否更改，它都会重新渲染模板，因此每次重新渲染 html 它都会调用 get每次调用它时都会返回一个新对象的方法，并且当 ngOnChanges 将其比较为值是一个新对象时，它现在在循环中运行。

这是更改检测如何工作的链接 https://angular-2-training-book.rangle.io/handout/change-detection/angular_1_vs_angular_2.html

于 2018-06-24T20:53:58.933 回答