diff --git a/client/src/components/onboarding/PaymentMethod.vue b/client/src/components/onboarding/PaymentMethod.vue
index 1b3bf824..36d1622f 100644
--- a/client/src/components/onboarding/PaymentMethod.vue
+++ b/client/src/components/onboarding/PaymentMethod.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { t } from "i18next";
+import { computed } from "vue";
 
 const props = defineProps<{
   modelValue: {
@@ -9,6 +10,15 @@ const props = defineProps<{
 
 const emit = defineEmits(["update:modelValue"]);
 
+const model = computed({
+  get() {
+    return props.modelValue;
+  },
+  set(value) {
+    emit("update:modelValue", value);
+  },
+});
+
 const paymentMethods = [
   { value: "credit_card", label: t("a.Debit-/Kreditkarte/Twint") },
   { value: "cembra_byjuno", label: t("a.Rechnung") },
@@ -20,7 +30,7 @@ const paymentMethods = [
     <div class="mt-2">
       <select
         id="paymentMethod"
-        v-model="props.modelValue.payment_method"
+        v-model="model.payment_method"
         required
         name="paymentMethod"
         class="block w-full border-0 py-1.5 text-gray-900 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"