Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
一臭打代码的 aka 潘先生です
vue-vben-admin
提交
9b2d41ea
V
vue-vben-admin
项目概览
一臭打代码的 aka 潘先生です
/
vue-vben-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-vben-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
9b2d41ea
编写于
5月 20, 2021
作者:
N
Netfan
提交者:
GitHub
5月 20, 2021
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat(form): add prop autoSubmitOnEnter (#620)
为Form添加autoSubmitOnEnter属性,当设置为true时,可以在input组件上按下回车时自动提交表单
上级
3bb6d11e
变更
3
隐藏空白更改
内联
并排
Showing
3 changed file
with
34 addition
and
13 deletion
+34
-13
src/components/Form/src/BasicForm.vue
src/components/Form/src/BasicForm.vue
+26
-12
src/components/Form/src/props.ts
src/components/Form/src/props.ts
+2
-0
src/components/Form/src/types/form.ts
src/components/Form/src/types/form.ts
+6
-1
未找到文件。
src/components/Form/src/BasicForm.vue
浏览文件 @
9b2d41ea
<
template
>
<Form
v-bind=
"
{ ...$attrs, ...$props }" :class="getFormClass" ref="formElRef" :model="formModel">
<Form
v-bind=
"
{ ...$attrs, ...$props }"
:class="getFormClass"
ref="formElRef"
:model="formModel"
@keypress.enter="handleEnterPress"
>
<Row
:style=
"getRowWrapStyle"
>
<slot
name=
"formHeader"
></slot>
<template
v-for=
"schema in getSchema"
:key=
"schema.field"
>
...
...
@@ -81,11 +87,9 @@
const
{
prefixCls
}
=
useDesign
(
'
basic-form
'
);
// Get the basic configuration of the form
const
getProps
=
computed
(
():
FormProps
=>
{
return
{
...
props
,
...
unref
(
propsRef
)
}
as
FormProps
;
}
);
const
getProps
=
computed
(():
FormProps
=>
{
return
{
...
props
,
...
unref
(
propsRef
)
}
as
FormProps
;
});
const
getFormClass
=
computed
(()
=>
{
return
[
...
...
@@ -97,12 +101,10 @@
});
// Get uniform row style
const
getRowWrapStyle
=
computed
(
():
CSSProperties
=>
{
const
{
baseRowStyle
=
{}
}
=
unref
(
getProps
);
return
baseRowStyle
;
}
);
const
getRowWrapStyle
=
computed
(():
CSSProperties
=>
{
const
{
baseRowStyle
=
{}
}
=
unref
(
getProps
);
return
baseRowStyle
;
});
const
getSchema
=
computed
(():
FormSchema
[]
=>
{
const
schemas
:
FormSchema
[]
=
unref
(
schemaRef
)
||
(
unref
(
getProps
).
schemas
as
any
);
...
...
@@ -213,6 +215,17 @@
formModel
[
key
]
=
value
;
}
function
handleEnterPress
(
e
:
KeyboardEvent
)
{
const
{
autoSubmitOnEnter
}
=
unref
(
getProps
);
if
(
!
autoSubmitOnEnter
)
return
;
if
(
e
.
key
===
'
Enter
'
&&
e
.
target
&&
e
.
target
instanceof
HTMLElement
)
{
const
target
:
HTMLElement
=
e
.
target
as
HTMLElement
;
if
(
target
&&
target
.
tagName
&&
target
.
tagName
.
toUpperCase
()
==
'
INPUT
'
)
{
handleSubmit
();
}
}
}
const
formActionType
:
Partial
<
FormActionType
>
=
{
getFieldsValue
,
setFieldsValue
,
...
...
@@ -236,6 +249,7 @@
return
{
handleToggleAdvanced
,
handleEnterPress
,
formModel
,
defaultValueRef
,
advanceState
,
...
...
src/components/Form/src/props.ts
浏览文件 @
9b2d41ea
...
...
@@ -37,6 +37,8 @@ export const basicProps = {
type
:
Object
as
PropType
<
Partial
<
ColEx
>>
,
},
autoSetPlaceHolder
:
propTypes
.
bool
.
def
(
true
),
// 在INPUT组件上单击回车时,是否自动提交
autoSubmitOnEnter
:
propTypes
.
bool
.
def
(
false
),
submitOnReset
:
propTypes
.
bool
,
size
:
propTypes
.
oneOf
([
'
default
'
,
'
small
'
,
'
large
'
]).
def
(
'
default
'
),
// 禁用表单
...
...
src/components/Form/src/types/form.ts
浏览文件 @
9b2d41ea
...
...
@@ -83,6 +83,8 @@ export interface FormProps {
fieldMapToTime
?:
FieldMapToTime
;
// Placeholder is set automatically
autoSetPlaceHolder
?:
boolean
;
// Auto submit on press enter on input
autoSubmitOnEnter
?:
boolean
;
// Check whether the information is added to the label
rulesMessageJoinLabel
?:
boolean
;
// Whether to show collapse and expand buttons
...
...
@@ -125,7 +127,10 @@ export interface FormSchema {
// Auxiliary text
subLabel
?:
string
;
// Help text on the right side of the text
helpMessage
?:
string
|
string
[]
|
((
renderCallbackParams
:
RenderCallbackParams
)
=>
string
|
string
[]);
helpMessage
?:
|
string
|
string
[]
|
((
renderCallbackParams
:
RenderCallbackParams
)
=>
string
|
string
[]);
// BaseHelp component props
helpComponentProps
?:
Partial
<
HelpComponentProps
>
;
// Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录