返回处理
按下返回键(默认 Backspace、Escape 及常见遥控器返回键)时,vuEPG 按以下顺序查找处理函数:
- 生效中的页面级处理函数(
onBack); - 全局处理函数(配置项
backHandler); - 都没有时什么也不做。
也可以调用 epg.back() 手动触发同样的流程。
全局处理函数
ts
app.use(VuEPG, {
backHandler: () => router.back(),
});页面级处理函数
在组件的 setup() 中调用 onBack:
vue
<script setup lang="ts">
import { useVuEPG } from "vuepg";
const epg = useVuEPG();
epg.onBack(() => {
// 先关闭弹窗,而不是直接返回上一页
closeDialog();
});
</script>Options API 中在 created() 里调用:
ts
export default {
created() {
this.$epg.onBack(() => this.close());
},
};生效规则
| 组件状态 | 处理函数 |
|---|---|
| 挂载 / KeepAlive 激活 | 生效 |
| KeepAlive 失活 | 暂停 |
| 卸载 | 移除 |
同时有多个处理函数生效时(例如页面中打开了一个弹窗,二者都注册了 onBack),最后登记且仍生效的处理函数优先;组件在 setup 阶段登记,因此嵌套组件或新打开的弹窗通常优先。弹窗卸载后,页面的处理函数自动恢复生效。