vant/packages/submit-bar/zh-CN.md

SubmitBar 提交订单栏

使用指南

import { SubmitBar } from 'vant';

Vue.use(SubmitBar);

代码演示

基础用法

<van-submit-bar
  :price="3050"
  button-text="提交订单"
  @submit="onSubmit"
/>

禁用状态

禁用状态下不会触发submit事件

<van-submit-bar
  disabled
  :price="3050"
  button-text="提交订单"
  tip="您的收货地址不支持同城送, 我们已为您推荐快递"
  @submit="onSubmit"
/>

加载状态

加载状态下不会触发submit事件

<van-submit-bar
  loading
  :price="3050"
  button-text="提交订单"
  @submit="onSubmit"
/>

高级用法

通过插槽插入自定义内容

<van-submit-bar
  :price="3050"
  button-text="提交订单"
  @submit="onSubmit"
>
  <van-checkbox v-model="checked">全选</van-checkbox>
  <span slot="tip">
    您的收货地址不支持同城送, <span>修改地址</span>
  </span>
</van-submit-bar>

API

参数	说明	类型	默认值
price	价格（单位分）	Number	-
label	价格文案	String	合计：
button-text	按钮文字	String	-
button-type	按钮类型	String	danger
tip	提示文案	String	-
disabled	是否禁用按钮	Boolean	false
loading	是否显示加载中的按钮	Boolean	false
currency	货币符号	String	¥

Event

事件名	说明	参数
submit	按钮点击事件回调	-

Slot

名称	说明
-	自定义订单栏左侧内容
top	自定义订单栏上方内容
tip	提示文案中的额外操作和说明

更新日志

版本	类型	内容
1.2.0	improvement	样式优化升级
1.1.6	improvement	优化渲染结构
1.0.6	feature	新增 currency 属性
1.0.5	bugfix	修复字体大小继承错误的问题
1.0.4	improvement	优化文字大小
1.0.4	bugfix	修复金额保留位数错误的问题
0.11.1	feature	新增默认插槽
0.9.2	feature	新增组件