屏幕阅读器会三次读取吐司内容

例如,可以通过项目 https://stackblitz.com/edit/react-toastify-next-js?file=README.md 验证这一点。 当您单击通知按钮时,屏幕阅读器(对于我来说,在 Windows 11 上的 NVDA)会读取以下内容: Hey Next.js!close notification timer notification Hey Next.js!close button Hey Next.js!close notification timer 最后一行是在通知被销毁时读取的。 我认为重复的原因是,该库将'role'添加到通知上,而不是通知容器上。 设置 role 会默认使元素成为活动区域,而活动区域内的活动区域会引发此类问题。