blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-24 10:20:19 +08:00
Code Issues Projects Releases Wiki Activity
vant/docs/markdown/zh-CN/submit-bar.md
neverland 493371c7a1
[Improvement] SubmitBar: add left slot (#345) 
* fix: Tabbar icon line-height

* [new feature] progress add showPivot prop

* [new feature] TabItem support vue-router

* [new feature] update document header style

* [Doc] add toast english ducoment

* [bugfix] Search box-sizing wrong

* [Doc] update vant-demo respo

* [Doc] translate theme & demo pages

* [Doc] add Internationalization document

* [bugfix] remove unnecessary props

* [fix] optimize clickoutside

* [new feature] optimize find-parent

* [new feature]: change document title accordinng to language

* [new feature] Pagination code review

* [improvement] adjust icon-font unicode

* [improvement] Icon spinner color inherit

* [improvement] icon default width

* [bugfix] DateTimePicker validate date props

* [bugfix] Tab item text ellipsis

* [improvement] optimize single line ellipsis

* [Improvement] optimzie staticClass

* [Improvement] Button: use sfc instread of jsx

* [Improvement] update actionsheet close icon style

* fix: yarn.lock

* fix: icon test cases

* [bugfix] errors during ssr

* [Improvement] SubmitBar add left slot
2017-11-23 20:23:42 +08:00

1.8 KiB
Raw Blame History

SubmitBar 提交订单栏

使用指南

import { SubmitBar } from 'vant';

Vue.component(SubmitBar.name, SubmitBar);

代码演示

基础用法

<van-submit-bar
  :price="3050"
  buttonText="提交订单"
  @submit="onClickButton"
/>

禁用状态

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

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

加载状态

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

<van-submit-bar
  loading
  :price="3050"
  buttonText="提交订单"
  @submit="onClickButton"
/>

高级用法

通过 slot 插入自定义内容

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

API

参数 说明 类型 默认值 必须
price 价格（单位分） Number - 是
buttonText 按钮文字 String - 是
buttonType 按钮类型 String danger 否
tip 提示文案 String - 否
disabled 是否禁用按钮 Boolean false 否
loading 是否显示加载中的按钮 Boolean false 否

Event

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

Slot

Name 说明
default 自定义订单栏左侧内容
tip 提示文案中的额外操作和说明