Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
夏日掠影
vue-vben-admin
提交
85b92a9a
V
vue-vben-admin
项目概览
夏日掠影
/
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,发现更多精彩内容 >>
未验证
提交
85b92a9a
编写于
4月 19, 2021
作者:
J
jinmao88
提交者:
GitHub
4月 19, 2021
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
perf: add AppendFormDemo (#503)
Co-authored-by:
haha
<
admin@qq.com
>
上级
bd83eccd
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
131 addition
and
0 deletion
+131
-0
src/locales/lang/en/routes/demo/form.ts
src/locales/lang/en/routes/demo/form.ts
+1
-0
src/locales/lang/zh_CN/routes/demo/form.ts
src/locales/lang/zh_CN/routes/demo/form.ts
+1
-0
src/router/menus/modules/demo/comp.ts
src/router/menus/modules/demo/comp.ts
+4
-0
src/router/routes/modules/demo/comp.ts
src/router/routes/modules/demo/comp.ts
+8
-0
src/views/demo/form/AppendForm.vue
src/views/demo/form/AppendForm.vue
+117
-0
未找到文件。
src/locales/lang/en/routes/demo/form.ts
浏览文件 @
85b92a9a
...
...
@@ -7,4 +7,5 @@ export default {
ruleForm
:
'
Form validation
'
,
dynamicForm
:
'
Dynamic
'
,
customerForm
:
'
Custom
'
,
appendForm
:
'
Append
'
,
};
src/locales/lang/zh_CN/routes/demo/form.ts
浏览文件 @
85b92a9a
...
...
@@ -7,4 +7,5 @@ export default {
ruleForm
:
'
表单验证
'
,
dynamicForm
:
'
动态表单
'
,
customerForm
:
'
自定义组件
'
,
appendForm
:
'
表单增删示例
'
,
};
src/router/menus/modules/demo/comp.ts
浏览文件 @
85b92a9a
...
...
@@ -47,6 +47,10 @@ const menu: MenuModule = {
path
:
'
customerForm
'
,
name
:
t
(
'
routes.demo.form.customerForm
'
),
},
{
path
:
'
appendForm
'
,
name
:
t
(
'
routes.demo.form.appendForm
'
),
},
],
},
{
...
...
src/router/routes/modules/demo/comp.ts
浏览文件 @
85b92a9a
...
...
@@ -89,6 +89,14 @@ const comp: AppRouteModule = {
title
:
t
(
'
routes.demo.form.customerForm
'
),
},
},
{
path
:
'
appendForm
'
,
name
:
'
appendFormDemo
'
,
component
:
()
=>
import
(
'
/@/views/demo/form/AppendForm.vue
'
),
meta
:
{
title
:
t
(
'
routes.demo.form.appendForm
'
),
},
},
],
},
{
...
...
src/views/demo/form/AppendForm.vue
0 → 100644
浏览文件 @
85b92a9a
<
template
>
<PageWrapper
title=
"表单增删示例"
>
<CollapseContainer
title=
"表单增删"
>
<BasicForm
@
register=
"register"
@
submit=
"handleSubmit"
>
<template
#add
="
{ field }">
<Button
v-if=
"field === 1"
@
click=
"add"
>
+
</Button>
<Button
v-if=
"field > 1"
@
click=
"del(field)"
>
-
</Button>
</
template
>
</BasicForm>
</CollapseContainer>
</PageWrapper>
</template>
<
script
lang=
"ts"
>
import
{
defineComponent
,
ref
}
from
'
vue
'
;
import
{
BasicForm
,
useForm
}
from
'
/@/components/Form/index
'
;
import
{
CollapseContainer
}
from
'
/@/components/Container/index
'
;
import
{
Input
}
from
'
ant-design-vue
'
;
import
{
PageWrapper
}
from
'
/@/components/Page
'
;
import
{
Button
}
from
'
/@/components/Button
'
;
export
default
defineComponent
({
components
:
{
BasicForm
,
CollapseContainer
,
PageWrapper
,
[
Input
.
name
]:
Input
,
Button
},
setup
()
{
const
[
register
,
{
appendSchemaByField
,
removeSchemaByFiled
,
validate
}]
=
useForm
({
schemas
:
[
{
field
:
'
field1a
'
,
component
:
'
Input
'
,
label
:
'
字段1
'
,
colProps
:
{
span
:
8
,
},
required
:
true
,
},
{
field
:
'
field1b
'
,
component
:
'
Input
'
,
label
:
'
字段1
'
,
colProps
:
{
span
:
8
,
},
required
:
true
,
},
{
field
:
'
1
'
,
component
:
'
Input
'
,
label
:
'
'
,
colProps
:
{
span
:
8
,
},
slot
:
'
add
'
,
},
],
labelWidth
:
100
,
actionColOptions
:
{
span
:
24
},
});
async
function
handleSubmit
()
{
try
{
const
data
=
await
validate
();
console
.
log
(
data
);
}
catch
(
e
)
{
console
.
log
(
e
);
}
}
const
n
=
ref
(
2
);
function
add
()
{
appendSchemaByField
(
{
field
:
'
field
'
+
n
.
value
+
'
a
'
,
component
:
'
Input
'
,
label
:
'
字段2
'
,
colProps
:
{
span
:
8
,
},
required
:
true
,
},
''
);
appendSchemaByField
(
{
field
:
'
field
'
+
n
.
value
+
'
b
'
,
component
:
'
Input
'
,
label
:
'
字段2
'
,
colProps
:
{
span
:
8
,
},
required
:
true
,
},
''
);
appendSchemaByField
(
{
field
:
`
${
n
.
value
}
`
,
component
:
'
Input
'
,
label
:
'
'
,
colProps
:
{
span
:
8
,
},
slot
:
'
add
'
,
},
''
);
n
.
value
++
;
}
function
del
(
field
)
{
console
.
log
(
field
);
removeSchemaByFiled
([
`field
${
field
}
a`
,
`field
${
field
}
b`
,
`
${
field
}
`
]);
}
return
{
register
,
handleSubmit
,
add
,
del
};
},
});
</
script
>
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录