如何将 id 传递给模态 window 组件

Question

我正在使用 Vue 和 Ionic，我不知道如何将我的 lesson.id 传递给方法 openModal()

说明：我有一张包含我的数据的卡片 - 课程数据，其中还有评论，当用户点击它们时，模态 window 打开，我需要将课程 ID 传递给我的模态 window 作为道具，所以我可以显示课程的评论。

<ion-content>
            <div
                class="lesson-card"
                v-for="lesson in lesson.video_lessons"
                :key="lesson"
            >
                <div class="lesson-content">
                    <h2>{{ lesson.content_description }}</h2>
                    <div class="tags">
                        <span v-for="tag in lesson.tags" :key="tag">
                            #{{ tag }}
                        </span>
                    </div>
                    <img
                        v-if="lesson.content_thumbnail"
                        :src="`${lesson.content_thumbnail}`"
                        alt="theme-img"
                        height="600"
                    />
                </div>
                <div class="sidebar-icons">
                    <a href="#">bookmark</a>
                    <a href="#">heart</a>
                    <p>{{ lesson.likes }}</p>
                    <a @click="openModal">comments</a>
                    <p>lesson id: {{ lesson.id }}</p>
                </div>
            </div>
</ion-content>

这是我的方法

async openModal() {
            const modal = await modalController.create({
                component: CommentsModal,
                componentProps: { id: 1 }, // i need to replace this 1 with id of the lesson
            })
            return modal.present()
        },

Answer 1

在模板中，像这样传递

<a @click="openModal(lession.id)">comments</a>

在方法中

async openModal(payload) { // change added
            const modal = await modalController.create({
                component: CommentsModal,
                componentProps: { id: payload}, // Change added
            })
            return modal.present()
        },

如何将 id 传递给模态 window 组件

How to pass id to modal window component

ionic-framework

vue.js