diff --git a/Frontend/src/components/xml/XmlInputFieldComponent.vue b/Frontend/src/components/xml/XmlInputFieldComponent.vue
index 8780c3d..b14767a 100644
--- a/Frontend/src/components/xml/XmlInputFieldComponent.vue
+++ b/Frontend/src/components/xml/XmlInputFieldComponent.vue
@@ -10,13 +10,13 @@ const props = defineProps(
         data: {type: String},
     }
 )
-const emit = defineEmits(['update'])
+const emit = defineEmits(['update:modelValue'])
 
 const data = ref('')
 const inputFile = ref()
 
 function sendValue() {
-    emit('update', data.value)
+    emit('update:modelValue', data.value)
 }
 
 function updateData(newData: string, clearFileSelector: boolean = true) {
diff --git a/Frontend/src/components/xml/XmlTabbedInputComponent.vue b/Frontend/src/components/xml/XmlTabbedInputComponent.vue
index eafab19..ff0a2ba 100644
--- a/Frontend/src/components/xml/XmlTabbedInputComponent.vue
+++ b/Frontend/src/components/xml/XmlTabbedInputComponent.vue
@@ -13,7 +13,7 @@ const props = defineProps(
         tabCountLimit: {type: Number, required: false}
     }
 )
-const emit = defineEmits(['update'])
+const emit = defineEmits(['update:modelValue'])
 
 const newTabId = ref(0);
 const activeTabId = ref(0);
@@ -30,7 +30,7 @@ const inputFile = ref()
 
 
 function sendValue() {
-    emit('update', tabs.value);
+    emit('update:modelValue', tabs.value);
 }
 
 function updateData(newData: string) {
diff --git a/Frontend/src/views/XPathView.vue b/Frontend/src/views/XPathView.vue
index be12426..41c06df 100644
--- a/Frontend/src/views/XPathView.vue
+++ b/Frontend/src/views/XPathView.vue
@@ -19,8 +19,8 @@ function updateVersion(newVersion: string) {
     <div id="layout" class="flex flex-row w-full h-full">
         <div class="flex flex-col 2xl:flex-row w-full xl:w-7/12 grow overflow-hide xl:pr-2">
             <div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
-                <xmlInputFieldComponent stylized-name="XML" :data="xml" @update="(data) => {xml = data}"></xmlInputFieldComponent>
-                <xmlInputFieldComponent stylized-name="XPath" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent>
+                <xmlInputFieldComponent stylized-name="XML" v-model="xml"></xmlInputFieldComponent>
+                <xmlInputFieldComponent stylized-name="XPath" v-model="query"></xmlInputFieldComponent>
             </div>
             <xmlOutputFieldComponent tool="xpath" :xml="xml" :query="query" @update="(version) => updateVersion(version)"></xmlOutputFieldComponent>
         </div>
diff --git a/Frontend/src/views/XQueryView.vue b/Frontend/src/views/XQueryView.vue
index 244c5d4..051f3e1 100644
--- a/Frontend/src/views/XQueryView.vue
+++ b/Frontend/src/views/XQueryView.vue
@@ -12,8 +12,8 @@ const query = ref('');
 <template>
     <div id="layout" class="flex flex-col 2xl:flex-row w-full h-full">
         <div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
-            <xmlInputFieldComponent stylized-name="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent>
-            <xmlInputFieldComponent stylized-name="XQuery" @update="(data) => {query = data}"></xmlInputFieldComponent>
+            <xmlInputFieldComponent stylized-name="XML" v-model="xml"></xmlInputFieldComponent>
+            <xmlInputFieldComponent stylized-name="XQuery" v-model="query"></xmlInputFieldComponent>
         </div>
         <xmlOutputFieldComponent tool="xquery" :xml="xml" :query="query"></xmlOutputFieldComponent>
     </div>
diff --git a/Frontend/src/views/XSDView.vue b/Frontend/src/views/XSDView.vue
index 04b0690..8f3d90a 100644
--- a/Frontend/src/views/XSDView.vue
+++ b/Frontend/src/views/XSDView.vue
@@ -12,8 +12,8 @@ const query = ref('');
 <template>
     <div id="layout" class="flex flex-col 2xl:flex-row w-full h-full">
         <div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
-            <xmlInputFieldComponent stylized-name="XML" @update="(data) => {xml = data}"></xmlInputFieldComponent>
-            <xmlInputFieldComponent stylized-name="XSD" @update="(data) => {query = data}"></xmlInputFieldComponent>
+            <xmlInputFieldComponent stylized-name="XML" v-model="xml"></xmlInputFieldComponent>
+            <xmlInputFieldComponent stylized-name="XSD" v-model="query"></xmlInputFieldComponent>
         </div>
         <xmlOutputFieldComponent tool="xsd" :xml="xml" :query="query"></xmlOutputFieldComponent>
     </div>
diff --git a/Frontend/src/views/XSLTView.vue b/Frontend/src/views/XSLTView.vue
index b00dc61..164f36e 100644
--- a/Frontend/src/views/XSLTView.vue
+++ b/Frontend/src/views/XSLTView.vue
@@ -22,8 +22,8 @@ function updateVersion(newVersion: string) {
     <div id="layout" class="flex flex-row w-full h-full">
         <div class="flex flex-col 2xl:flex-row w-full xl:w-7/12 grow overflow-hide pr-2">
             <div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
-                <xmlTabbedInputComponent stylized-name="XML" :tab-count-limit="3" :data="xml" @update="(data) => {xml = data}"></xmlTabbedInputComponent>
-                <xmlInputFieldComponent stylized-name="XSLT" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent>
+                <xmlTabbedInputComponent stylized-name="XML" :tab-count-limit="3" v-model="xml"></xmlTabbedInputComponent>
+                <xmlInputFieldComponent stylized-name="XSLT" :data="query" v-model="query"></xmlInputFieldComponent>
             </div>
             <xmlOutputFieldComponent tool="xslt" :xml="xml" :query="query" @update="updateVersion"></xmlOutputFieldComponent>
         </div>