mirror of
https://gitee.com/vant-contrib/vant-weapp.git
synced 2025-04-06 03:58:05 +08:00
102 lines
3.1 KiB
Plaintext
102 lines
3.1 KiB
Plaintext
<doc-page title="Field" without-padding>
|
|
<!-- Field 基础用法 -->
|
|
<zan-panel title="基础用法">
|
|
<zan-field
|
|
title="{{ config.base.name.title }}"
|
|
placeholder="{{ config.base.name.placeholder }}"
|
|
focus="{{ config.base.name.focus }}"
|
|
value="{{ value }}"
|
|
>
|
|
</zan-field>
|
|
<zan-field
|
|
title="{{ config.base.tel.title }}"
|
|
placeholder="{{ config.base.tel.placeholder }}"
|
|
error="{{ config.base.tel.error }}"
|
|
input-type="{{ config.base.tel.inputType }}"
|
|
>
|
|
</zan-field>
|
|
<zan-field
|
|
title="{{ config.base.address.title }}"
|
|
type="{{ config.base.address.type }}"
|
|
placeholder="{{ config.base.address.placeholder }}"
|
|
>
|
|
</zan-field>
|
|
<zan-field
|
|
title="{{ config.base.disabled.title }}"
|
|
value="{{ config.base.disabled.value }}"
|
|
disabled="{{ config.base.disabled.disabled }}"
|
|
>
|
|
</zan-field>
|
|
</zan-panel>
|
|
|
|
<view class="zan-btns">
|
|
<zan-button type="primary" bind:btnclick="clearInput">清除输入</zan-button>
|
|
</view>
|
|
|
|
<!-- 去除标题后的输入框样式 -->
|
|
<zan-panel title="无标题输入框">
|
|
<zan-field
|
|
placeholder="{{ config.notitle.placeholder }}"
|
|
value="{{ textareaValue }}"
|
|
>
|
|
</zan-field>
|
|
</zan-panel>
|
|
|
|
<view class="zan-btns">
|
|
<zan-button type="primary" bind:btnclick="clearTextarea">清除输入</zan-button>
|
|
</view>
|
|
|
|
<!-- 使用 Field 圆角样式 -->
|
|
<zan-panel title="圆角输入框">
|
|
<zan-field
|
|
title="{{ config.radius.totalPrice.title }}"
|
|
type="{{ config.radius.totalPrice.type }}"
|
|
placeholder="{{ config.radius.totalPrice.placeholder }}"
|
|
right="{{ config.radius.totalPrice.right }}"
|
|
mode="{{ config.radius.totalPrice.mode }}"
|
|
>
|
|
</zan-field>
|
|
<zan-field
|
|
class="zan-field--radius"
|
|
title="{{ config.radius.excludePrice.title }}"
|
|
type="{{ config.radius.excludePrice.type }}"
|
|
placeholder="{{ config.radius.excludePrice.placeholder }}"
|
|
right="{{ config.radius.excludePrice.right }}"
|
|
mode="{{ config.radius.excludePrice.mode }}"
|
|
error="{{ config.radius.excludePrice.error }}"
|
|
>
|
|
</zan-field>
|
|
<zan-field
|
|
placeholder="{{ config.radius.notitle.placeholder }}"
|
|
mode="{{ config.radius.notitle.mode }}"
|
|
input-type="{{ config.radius.notitle.inputTitle }}"
|
|
>
|
|
</zan-field>
|
|
</zan-panel>
|
|
|
|
<!-- <view class="zan-panel-title">Form 表单中的field应用</view> -->
|
|
<!-- <form bindsubmit="formSubmit" bindreset="formReset">
|
|
<view class="zan-panel">
|
|
<zan-field
|
|
name="{{ config.form.name.name }}"
|
|
placeholder="{{ config.form.name.placeholder }}"
|
|
>
|
|
</zan-field>
|
|
<zan-field
|
|
name="{{ config.form.tel.name }}"
|
|
placeholder="{{ config.form.tel.placeholder }}"
|
|
input-type="{{ config.form.tel.inputType }}"
|
|
>
|
|
</zan-field>
|
|
<view class="zan-btns">
|
|
<button
|
|
class="zan-btn zan-btn--primary"
|
|
formType="submit">提交数据</button>
|
|
<button
|
|
class="zan-btn"
|
|
formType="reset">重置数据</button>
|
|
</view>
|
|
</view>
|
|
</form> -->
|
|
</doc-page>
|