似乎焦点重置和屏幕阅读器注意到路线变化不是 vue-router 的一部分。
我可以理解为什么 vue 可能会忽略这一点，因为用例可能会有所不同，但我对缺乏有关可访问性/SPA 路由器的信息感到惊讶。
这似乎是一个常见的 SPA 问题，我很好奇是否有人对此有推荐的解决方案，或者是否有计划将其实现到 vue-router 的核心中。
似乎专用的 aria-live 区域可能是宣布页面更改的不错选择，但我很好奇一旦用户访问新路线，将选项卡焦点和屏幕阅读器重置到新页面的顶部。
这是我找到的一篇文章。
https://medium.com/@robdel12/single-page-apps-routers-are-broken-255daa310cf https://medium.com/@robdel12/single-page-apps-routers-are-broken-255daa310cf
我写了一个库来解决这个问题：Oaf Vue 路由器 https://github.com/oaf-project/oaf-vue-router.
它负责：
- 页面导航后重置滚动和焦点
- 设置导航后的页面标题
- 向屏幕阅读器用户宣布导航
- 哈希片段支持
安装：
# yarn
yarn add oaf-vue-router
# npm
npm install oaf-vue-router
基本用法：
import VueRouter from "vue-router";
import { wrapRouter } from "oaf-vue-router";
const router = new VueRouter({
...
...
...
});
wrapRouter(router);
高级用法：https://github.com/oaf-project/oaf-vue-router#advanced-usage https://github.com/oaf-project/oaf-vue-router#advanced-usage
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
