将项目动态添加到 mdl 菜单

Question

我想将菜单项动态添加到 mdl 菜单。但是，我还没有弄清楚如何使用 mdl 注册新项目以便它们正常工作。

这是一个codepen，显示了不同的行为。值得注意的是，动态项没有涟漪效应，也没有在点击时关闭菜单。

该代码笔在新创建的项目和原始菜单元素上都使用componentHandler.upgradeElement 无效。我注意到正确创建的菜单项除了一些其他属性之外还有另一个类（mdl-js-ripple-effect），但是手动添加该类，或者尝试使用元素数据导致很多错误在 mdl javascript 中。我假设我只需要对 componentHandler 方法进行一些适当的调用，但我无法找到任何关于它与子元素的正确使用的文档。

Answer 1

遗憾的是，目前这非常复杂，实际上由于错误而导致性能问题。不推荐。

最好的办法是销毁菜单并即时重建它。

MDL 适用于更多静态站点，Polymer 建议用于需要更复杂控制和动态构建的站点。

您也可以不使用我们的 JS 并为此需要编写自己的组件。