button

按钮。

属性名	类型	默认值	说明
size	String	default	有效值 default, mini
type	String	default	按钮的样式类型，有效值 primary, default, warn
plain	Boolean	false	按钮是否镂空，背景色透明
disabled	Boolean	false	是否禁用
loading	Boolean	false	名称前是否带 loading 图标
form-type	String	无	有效值：submit, reset，用于 <form/> 组件，点击分别会触发 submit/reset 事件
hover-class	String	button-hover	指定按钮按下去的样式类。当 hover-class="none" 时，没有点击态效果

 

注：button-hover 默认为{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}

 

<view class="page">

  <view class="page__hd">

    <text class="page__title">button</text>

    <text class="page__desc">按钮</text>

  </view>

  <view class="page__bd">

    <view class="btn-area" id="buttonContainer">

      <view class="button-wrapper">

        <button type="default" size="{{defaultSize}}" loading="{{loading}}" plain="{{plain}}"

          disabled="{{disabled}}" bindtap="default"> default

        </button>

      </view>

 

      <view class="button-wrapper">

        <button type="primary" size="{{primarySize}}" loading="{{loading}}" plain="{{plain}}"

          disabled="{{disabled}}" bindtap="primary"> primary

        </button>

      </view>

      <view class="button-wrapper">

        <button type="warn" size="{{warnSize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}"

          bindtap="warn"> warn

        </button>

      </view>

      <view class="button-wrapper">

        <button bindtap="setDisabled">点击设置以上按钮disabled属性</button>

      </view>

      <view class="button-wrapper">

        <button bindtap="setPlain">点击设置以上按钮plain属性</button>

      </view>

      <view class="button-wrapper">

        <button bindtap="setLoading">点击设置以上按钮loading属性</button>

      </view>

    </view>

  </view>

</view>