javascript - 将 Material 设计与 VueJS 结合使用

Question

我正在使用 VueJs 构建一个 Web 应用程序，并且需要一个 CSS 框架来设计一些东西，而不是从头开始!

我找到了material-design-lite (www.getmdl.io)，但我无法让它与vue-router一起正常工作。

我的第一页正确显示，但当我尝试移动到另一个页面时，出现此错误:

vue.esm.js?65d7:467 DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

我认为这是因为文档中的“在动态网站上使用 MDL”( https://getmdl.io/started/index.html )，但我无法弄清楚并解决我的问题。

否则，我找不到 vue 的示例来解决这个问题。

有人知道如何让 mdl 与 vuejs 一起使用吗？

谢谢，朱尔斯。

Answer 1

一些元素是在 MDL 的 componentHandler 运行后由 Vue 插入的，因此您必须重新启动它们。您可以在已安装的 Hook 中执行此操作:

mounted: function(){
    componentHandler.upgradeAllRegistered();
}