Router-view inside v-for loop. How to set a dynamic route name?

Question

Vue.js

I create a component - a directory of contacts. Inside this component, there is a loop that creates separate router-views for each card with its own unique name. This is done so that each card can be edited separately, showing the edit form only in it (contact information disappears -> a form with edit fields appears)

<template>
    <div class="contact-cards">
        <div class="contact-cards__wrap">
            <h4 class="contact-cards__title">Контактные лица</h4>
            <router-link :to="'/panel/partners/' + this.$route.params.id + '/add-contact'">
                <button class="btn btn-outline-primary button-add">Добавить контакт</button>
            </router-link>
        </div>
       <div class="contact-card contact-cards__contact-card" v-for="contact in contacts" :key="contact.id">
            <router-view :name="'info' + contact.id" />
        </div>
        <router-link :to="'/panel/partners/' + this.$route.params.id + '/add-contact'">
            <button class="btn btn-outline-primary button-add">Добавить контакт</button>
        </router-link>
    </div>
</template>

The problem is how to describe routes with such a dynamic name in router.js

{
                    path: '/panel/partners/:id',
                    component: () => import('./components/partner/partners/profile-partner.vue'),
                    children: [
                        {
                            path: '/panel/partners/:id',
                            components: {
                                info: () => import('./components/partner/partners/profile/view-data-for-partner.vue'),
                                contact: () => import('./components/partner/partners/profile/view-contact-person.vue'),
                                company: () => import('./components/partner/partners/profile/view-company.vue'),
                            },
                            children: [
                                {
                                    path: '/panel/partners/:id',
                                    components: {
                                        "тут имя с переменной": () => import('./components/partner/partners/profile/contact-person.vue'),
                                    }
                                }
                            ]
                        },
}

I do not understand what needs to be written instead of "there is a name with a variable" so that everything works as intended. Is it really possible to bring this idea to life?