子组件中

点击<li>，传输当前列的数据，当前<li>绑定click事件，把需要传输的参数作为click事件的参数。

<ui>
    <li  ref="groupRef" v-for="item in group.list" :key="item.id" class="item"
        @click="singerDetail(item.mid)"
    >
        <span class="avatar" >
            <el-image :src="item.pic" lazy  />
        </span>
        <a class="name">{{item.name}}</a>
    </li>
    <el-divider style="width: 100%" border-style="dashed" />
</ui>

在<script>标签体中定义emits，emits的定义是与component、setup等这些属性是同级

emits:['select', 'xxx'],

在setup( )中实现click事件，绑定自定义事件（注意：setup()的参数需要 props 和 { emit } ）

setup(props,{ emit }) {
    const singerDetail = item => {
        emit('select', item)
        // console.log('item = ' + item)
    }

    return{
        singerDetail
    }
}

完整<script>代码：

 父组件中

 在需要使用的组件中实现自定义函数，let一个值接收参数，

selectSinger(singer){
    let mySelectSinger = singer;
    // console.log('mySelectSinger= ' + mySelectSinger)
    this.$router.push({
        name: 'singerDetail',
        params:{
            mySelectSinger : mySelectSinger
        }
    })
}