Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
DCloud
uni-app
提交
f62a1373
U
uni-app
项目概览
DCloud
/
uni-app
4 个月 前同步成功
通知
731
Star
38707
Fork
3642
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
7
列表
看板
标记
里程碑
合并请求
1
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
7
Issue
7
列表
看板
标记
里程碑
合并请求
1
合并请求
1
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
未验证
提交
f62a1373
编写于
5月 08, 2020
作者:
卷
卷尾松鼠
提交者:
GitHub
5月 08, 2020
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Update form.md
小程序端在`from`内的自定义组件内有`input`等表单控件时 -> 小程序端在`form`内的自定义组件内有`input`等表单控件时
上级
cd91de30
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
60 addition
and
60 deletion
+60
-60
docs/component/form.md
docs/component/form.md
+60
-60
未找到文件。
docs/component/form.md
浏览文件 @
f62a1373
...
...
@@ -94,66 +94,66 @@
```
![
uniapp
](
https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/form.png?t=201857
)
**小程序端注意事项**
小程序端在
`f
rom`
内的自定义组件内有
`input`
等表单控件时,无法在
`form`
的
`submit`
事件内获取组件内表单控件值,此时可以使用
`behaviors`
,示例如下:
```
html
<!-- /pages/index/index.vue -->
<template>
<view
class=
"content"
>
<form
@
submit=
"onSubmit"
>
<comp-input
name=
"test"
v-model=
"testValue"
></comp-input>
<button
form-type=
"submit"
>
Submit
</button>
</form>
</view>
</template>
<script>
export
default
{
data
()
{
return
{
testValue
:
'
Hello
'
}
},
methods
:
{
onSubmit
(
e
)
{
console
.
log
(
e
)
}
}
}
</script>
<style>
</style>
```
```
html
<!-- /components/compInput/compInput.vue -->
<template>
<view>
<input
name=
"test"
style=
"border: solid 1px #999999;height: 80px;"
type=
"text"
@
input=
"onInput"
:value=
"value"
/>
</view>
</template>
<script>
export
default
{
name
:
'
compInput
'
,
behaviors
:
[
'
uni://form-field
'
],
methods
:
{
onInput
(
e
)
{
this
.
$emit
(
'
input
'
,
e
.
detail
.
value
)
}
}
}
</script>
<style>
</style>
```
**小程序端注意事项**
小程序端在
`f
orm`
内的自定义组件内有
`input`
等表单控件时,无法在
`form`
的
`submit`
事件内获取组件内表单控件值,此时可以使用
`behaviors`
,示例如下:
```
html
<!-- /pages/index/index.vue -->
<template>
<view
class=
"content"
>
<form
@
submit=
"onSubmit"
>
<comp-input
name=
"test"
v-model=
"testValue"
></comp-input>
<button
form-type=
"submit"
>
Submit
</button>
</form>
</view>
</template>
<script>
export
default
{
data
()
{
return
{
testValue
:
'
Hello
'
}
},
methods
:
{
onSubmit
(
e
)
{
console
.
log
(
e
)
}
}
}
</script>
<style>
</style>
```
```
html
<!-- /components/compInput/compInput.vue -->
<template>
<view>
<input
name=
"test"
style=
"border: solid 1px #999999;height: 80px;"
type=
"text"
@
input=
"onInput"
:value=
"value"
/>
</view>
</template>
<script>
export
default
{
name
:
'
compInput
'
,
behaviors
:
[
'
uni://form-field
'
],
methods
:
{
onInput
(
e
)
{
this
.
$emit
(
'
input
'
,
e
.
detail
.
value
)
}
}
}
</script>
<style>
</style>
```
**tips**
-
[
插件市场
](
http://ext.dcloud.net.cn/search?q=%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C
)
有表单校验插件
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录