如何等待路由完成？

Question

当用户单击链接时，它使用路由将用户发送到另一个组件，您可以从首页开始，也可以单击到图表。我的问题是我需要获取Charts元素的queryselector，但是当从组件加载代码时，它尚不存在。如何等待创建的元素执行代码？

Answer 1

我通过在构造函数内部添加MutationObserver解决了这个问题。

Element chartsElement;

ChartsComponent() {
  MutationObserver observer = MutationObserver(_onMutation);
  Element my_app = querySelector('my-app');
  observer.observe(my_app, childList: true);
}

_onMutation(List<dynamic> mutations, MutationObserver observer) {
  mutations.forEach((value) {
    MutationRecord record = value as MutationRecord;
    if (record.addedNodes.contains('charts')) {
      chartsElement = record.addedNodes[0];
    }
  });
  observer.disconnect();
  //Do stuff
}