src/components/VnTable/VnTable.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, onMounted, computed, watch, useAttrs } from 'vue';
+import { ref, onMounted, computed, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute, useRouter } from 'vue-router';
 import { useQuasar } from 'quasar';
@@ -60,7 +60,6 @@ const $props = defineProps({
         default: false,
     },
 });
-const attrs = useAttrs();
 const { t } = useI18n();
 const stateStore = useStateStore();
 const route = useRoute();

src/components/common/VnComponent.vue

@@ -4,7 +4,7 @@
             v-if="toComponent?.component"
             :is="mix(toComponent).component"
             v-bind="mix(toComponent).attrs"
-            v-on="mix(toComponent).event"
+            v-on="mix(toComponent).event ?? {}"
             v-model="model"
         />
     </span>
@@ -21,12 +21,10 @@ const $props = defineProps({
     components: {
         type: Object,
         default: () => {},
-        required: false,
     },
     value: {
-        type: Object,
+        type: [Object, Number, String],
         default: () => {},
-        required: false,
     },
 });
 

src/pages/Customer/ExtendedList/CustomerExtendedList.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed } from 'vue';
+import { ref, computed, markRaw } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import VnTable from 'components/VnTable/VnTable.vue';
@@ -95,7 +95,7 @@ const columns = computed(() => [
         name: 'phone',
         cardVisible: true,
         after: {
-            component: VnLinkPhone,
+            component: markRaw(VnLinkPhone),
             props: (prop) => ({
                 'phone-number': prop.phone,
             }),