Fix modal can not focus second input bug

This commit is contained in:
2024-03-01 16:35:49 +08:00
parent e2dfe89d04
commit 3b11b262b9
8 changed files with 178 additions and 85 deletions

View File

@@ -234,6 +234,12 @@ const Base = () => {
title: '编译',
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<>
<AntdForm form={compileForm}>
@@ -538,11 +544,23 @@ const Base = () => {
const handleOnAddFile = () => {
void modal.confirm({
title: '新建文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={addFileForm}>
<AntdForm
form={addFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'文件名'}
@@ -568,11 +586,7 @@ const Base = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),
@@ -721,11 +735,23 @@ const Base = () => {
renameFileForm.setFieldValue('fileName', fileName)
void modal.confirm({
title: '重命名文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={renameFileForm}>
<AntdForm
form={renameFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'新文件名'}
@@ -754,11 +780,7 @@ const Base = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),

View File

@@ -399,11 +399,23 @@ const Template = () => {
const handleOnAddFile = () => {
void modal.confirm({
title: '新建文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={addFileForm}>
<AntdForm
form={addFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'文件名'}
@@ -429,11 +441,7 @@ const Template = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),
@@ -585,11 +593,23 @@ const Template = () => {
renameFileForm.setFieldValue('fileName', fileName)
void modal.confirm({
title: '重命名文件',
getContainer: false,
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={renameFileForm}>
<AntdForm
form={renameFileForm}
ref={(ref) => {
setTimeout(() => {
ref?.getFieldInstance('fileName').focus()
}, 50)
}}
>
<AntdForm.Item
name={'fileName'}
label={'新文件名'}
@@ -618,11 +638,7 @@ const Template = () => {
})
]}
>
<AntdInput
ref={(input) => {
input?.focus()
}}
/>
<AntdInput />
</AntdForm.Item>
</AntdForm>
),

View File

@@ -197,6 +197,12 @@ const Tools = () => {
title: '审核',
centered: true,
maskClosable: true,
footer: (_, { OkBtn, CancelBtn }) => (
<>
<OkBtn />
<CancelBtn />
</>
),
content: (
<AntdForm form={form}>
<AntdForm.Item