github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: modal aria error

pull/7937/head
tangjinzhou 2024-11-11 14:40:49 +08:00
parent b0d9309471
commit 888457238d
1 changed files with 8 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
components/vc-dialog/Content.tsx
View File

@ -5,7 +5,7 @@ import { getTransitionProps } from '../_util/transition';
import dialogPropTypes from './IDialogPropTypes';
import { offset } from './util';
const sentinelStyle = { width: 0, height: 0, overflow: 'hidden', outline: 'none' };
const entityStyle = { outline: 'none' };
export type ContentRef = {
focus: () => void;
changeActive: (next: boolean) => void;
@ -28,14 +28,14 @@ export default defineComponent({
const dialogRef = ref<HTMLDivElement>();
expose({
focus: () => {
sentinelStartRef.value?.focus();
sentinelStartRef.value?.focus({ preventScroll: true });
},
changeActive: next => {
const { activeElement } = document;
if (next && activeElement === sentinelEndRef.value) {
sentinelStartRef.value.focus();
sentinelStartRef.value.focus({ preventScroll: true });
} else if (!next && activeElement === sentinelStartRef.value) {
sentinelEndRef.value.focus();
sentinelEndRef.value.focus({ preventScroll: true });
}
},
});
@ -143,9 +143,10 @@ export default defineComponent({
onMousedown={onMousedown}
onMouseup={onMouseup}
>
<div tabindex={0} ref={sentinelStartRef} style={sentinelStyle} inert/>
{modalRender ? modalRender({ originVNode: content }) : content}
<div tabindex={0} ref={sentinelEndRef} style={sentinelStyle} inert/>
<div tabindex={0} ref={sentinelStartRef} style={entityStyle}>
{modalRender ? modalRender({ originVNode: content }) : content}
</div>
<div tabindex={0} ref={sentinelEndRef} style={sentinelStyle} />
</div>
) : null}
</Transition>