Utilisation de la conception matérielle avec VueJS

Question

Je construis une application web avec VueJs et j'ai besoin d'un framework CSS pour concevoir quelque chose qui ne soit pas à partir de rien!

J'ai trouvé material-design-lite (www.getmdl.io) mais je ne pouvais pas le faire fonctionner correctement avec vue-routeur.

Ma première page est correctement affichée mais lorsque je tente de passer à une autre page, j'ai cette erreur:

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. 

Je pensais qu'il était à cause de la « utilisation LDM sur les sites Web dynamiques » de la documentation (https://getmdl.io/started/index.html) mais je ne pouvais pas comprendre et résoudre mon problème.

Sinon, je n'ai pas trouvé d'exemples avec vue pour résoudre ce problème.

Quelqu'un sait comment faire fonctionner mdl avec vuejs?

Merci, Jules.

Answer 1

Certains éléments sont insérés par Vue après l'exécution de componentHandler par MDL, vous devez donc les redémarrer eux. Vous pouvez le faire dans le crochet monté:

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