使用this.$refs.子组件.$on,出现$on is not a function的错误

我用vue-cli创建了一个项目,进行简单的组件自定义事件的练习。我的组件结构如下:
App是父组件,有两个子组件,分别是和, 我在mounted中给创建了一个自定义事件,事件很简单,就是显示学生的姓名。
App父组件的源码如下:


然后在的中,是利用按钮的click触发了自定义的mystudent事件,源码如下:

现在问题是,我使用npm run serve让程序运行起来后,浏览器中报this.$refs.rockStudent.$on is not a function的错误,不知道到底是哪里的问题。
麻烦各位大大,或者遇到类似问题的同学能不吝赐教吗?

如果你用的是 Vue 3,$on API 已经被移除了。

https://v3-migration.vuejs.org/zh/breaking-changes/events-api.html