Question

如何动态更改核心图标按钮的on-tap方法？换句话说，如何覆盖/挂钩core-scaffold的菜单按钮以使其更多？

使用案例：如果在主页以外的任何页面上，我想将菜单按钮更改为后退按钮并返回而不是滑动打开菜单。我使用core-scaffold已经有一个调用自己的toggleDrawer方法的菜单按钮。我可以在辅助页面上更改图标（请参阅我的代码），但如何更改on-tap="toggleDrawer"以调用其他方法，或以其他方式处理此问题？我宁愿避免重新创建core-scaffold为我简化的内容。

这是我的主app元素中的一个方法：

void switchPage(Event e, var detail, Element target) {
    CoreScaffold scaffold = $['scaffold'];
    scaffold.closeDrawer();
    app.selectedPage = int.parse(target.dataset['page']);

    // Change the menu icon to a back icon.
    CoreIconButton menuButton = querySelector('core-scaffold::shadow core-icon-button');
    menuButton.icon = "arrow-back";
    // TODO: Now how do I call a goBack method?

    app.router.dispatch(url: target.dataset['url']);
  }

Answer 1

IMO可能更容易重新创建core-scaffold，但可以利用您自己的按钮来实现您所追求的行为。感觉就像是通过使用querySelector更改图标来打破封装，如果你开始改变它从外部运行的方法，那就更好了。

这让我觉得将core-scaffold变成更多的例子可能是一个好主意，因为其他开发人员总是会遇到同样的困境。

如何让core-scaffold的菜单按钮做得更多？

1 个答案: