Vue.js: code v1 ne fonctionne pas sous la v2. Pourquoi.

Par PhiSyX, il y a 9 ans

Javascript

Bonjour,
Voulant tester la v2 de Vue, j'ai repris un code que j'avais déjà dans sa v1.

C'est quelque chose de simple:
Double cliquer sur une div avec du texte pour le transformer en <textarea> et lorsqu'on quitte le champ textarea (blur), qu'il redevienne une div texte. Basique.

Seulement sous la v1, je n'ai aucune erreur, et ça fonctionne "bien".
Par contre sous la v2 j'ai ceci:
(jsfiddle)

vue.min.js:6 Uncaught TypeError: Cannot read property 'removeChild' of null at Object.Ze [as removeChild] (vue.min.js:6) at r (vue.min.js:6) at n (vue.min.js:6) at v (vue.min.js:6) at p (vue.min.js:6) at m (vue.min.js:6) at h (vue.min.js:6) at m (vue.min.js:6) at h (vue.min.js:6) at m (vue.min.js:6)

Voici le code:
https://jsfiddle.net/6shrbq5q/ - version vue1.0.26
https://jsfiddle.net/t5top279/ - version vue2.0.0-rc.5

Merci

3 réponses

PhiSyX, il y a 9 ans

Re moi.

J'ai réussi à résoudre le problème en y mettant des v-show au lieux des attributs v-if/v-else. (Voir ici: https://jsfiddle.net/t5top279/1/)

Ceci dit, si je continuais à garder mon premier code de la v2 ( https://jsfiddle.net/t5top279/ ):
En elevant l'attribut v-html="elTopicTextHtmlContent" (avec v-text ça bug aussi), que j'affiche la donnée avec la syntaxe moustache double {{ elTopicTextHtmlContent }}, ça ne bug PAS. Mais cependant, moi j'ai besoin v-html. et la syntaxe moustache triple {{{ }}} a été enlevé dans vue2.

Grafikart, il y a 9 ans

Fait attention il y a quand même pas mal de changement normalement v-html marche

PhiSyX, il y a 9 ans

Oui, il y a pas mal de changement, je regarde attentivement la doc (rc.) :-P

J'ai remarqué qu'avec une double utilisation de l'attribut ref (qu'ils ont un nom different ou non d'ailleurs) avec les attributs v-if/v-else: les attributs v-html et v-text bogues (dans mon cas, je ne les ai pas tous testés les attributs)

Ex: https://jsfiddle.net/PhiSyX/2h870xpk/