Skip to content

update vue2 -> vue3, fixes #3747

Jan-Hendrik Willms requested to merge step-3747-vue3 into main

Was beachtet werden muss bei der Umstellung von vorhandenem Code:

  • Die Lifecycle Hooks beforeDestroy und destroyed gibt es nicht mehr. Dies sind nun beforeUnmount und unmounted.
  • Das Verhalten von v-model hat sich geändert. Die Property ist nicht mehr value sondern modelValue und der Emit ist nicht mehr input sondern update:modelValue, welcher auch explizit in den emits der Komponente angegeben werden soll.
  • Die Komponente vuedraggable hat ihr Verhalten geändert. Das <draggable>-Elemente übernimmt das Erzeugen der Kindknoten nun selber. Dafür braucht es eine item-key-Angabe an diesem Element (dort muss ein Attribut der Elemente angegeben werden, das als :key verwendet wird; kann man meistens direkt aus dem :key beim v-for innerhalb des Elements sehen). Der Kindknoten darf selbst kein v-for machen und muss in einem Element <template #item="{element, index}"> gewrappt sein. Die Angabe von index ist dabei optional.
  • Wenn Arrays überwacht werden und es wichtig ist, dass jede Änderung erfasst wird, muss noch die Angabe deep: true am Watcher ergänzt werden. Beispiel:
       watch: {
           // vorher
           foo(current) {
               // ...
           }
    
           // nachher
           foo: {
               handler(current) {
                   // ...
               },
               deep: true
           }
       }
Edited by Jan-Hendrik Willms

Merge request reports