How do subcomponents of vue v-for rendering register click events?

< H2 > question background: < / H2 >

Mobile h5, the child component is introduced into the parent component, now you need to render the child component with v-for, click on each child component to jump to the corresponding contact"s chat page. It was originally done through router-link, but it was found that clicking on it had no effect and thought that what went wrong was changed to @ click. But now that the event binding is not successful, the positioning problem should be that the stand-alone event is not bound to the sub-components, and it should be the life cycle of asynchronous or dom rendering. Because later in the mounted life cycle I manually fetched the subcomponents and bound the events through the this.$nextTick () function was successful.
Let"s see how this code is written elegantly and conforms to the routine. Use router or @ click or whatever, vue newcomers. The
code is as follows:

methods: {
    toTalk (event) {
        console.log(12345)
    }
}
Mar.13,2021

@ click.native
clipboard.png


<fb-contact
    :icon-src="msg.iconSrc"
    :msg-source="msg.msgSource"
    :msg-timestamp="msg.msgTimestamp"
    :sub-content="msg.msgContent"
    :msg-count="msg.msgCount"
    v-for="msg in msgs"
    :key="msg.msgTimestamp"
    @click.native="toTalk" <!-- @click.native -->
></fb-contact>
Menu