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

PhiSyX
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
Auteur
Réponse acceptée

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

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

PhiSyX
Auteur

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/