表单组件 - button - 《Development Guide》

open-type 有效值
scope 有效值
图示
代码示例

按钮（button）

属性名	类型	默认值	描述
size	String	default	有效值为 default、mini。
type	String	default	按钮的样式类型，有效值为 primary、default、warn。
plain	Boolean	false	是否镂空。
disabled	Boolean	false	是否禁用。
loading	Boolean	false	按钮文字前是否带 loading 图标。
hover-class	String	button-hover	按钮按下去的样式类。 hover-class=”none”时表示没有点击态效果。说明：button-hover默认为{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}。
hover-start-time	Number	20	按住后多少事件后出现点击状态，单位毫秒。
hover-stay-time	Number	70	手指松开后点击状态保留时间，单位毫秒。
hover-stop-propagation	Boolean	false	是否阻止当前元素的祖先元素出现点击态。
form-type	String	-	有效值为 submit、reset，用于组件，点击分别会触发 submit/reset 事件。
open-type	String	-	开放能力
scope	String	-	当open-type为getAuthorize时有效。
onTap	EventHandle	-	点击
app-parameter	String	-	打开 APP 时，向 APP 传递的参数，open-type=”launchApp”时有效。

open-type 有效值

值	说明
share	触发自定义分享，可使用 canIUse(‘button.open-type.share’) 判断
getAuthorize	支持小程序授权，可使用 canIUse(‘button.open-type.getAuthorize’) 判断
contactShare	分享到通讯录好友，可使用 canIUse(‘button.open-type.contactShare’) 判断

scope 有效值

当open-type为getAuthorize时，可以设置 scope 为以下值：

值	说明
phoneNumber	唤起授权界面，用户可以授权小程序获取用户手机号

图示

代码示例

<view class="page">
  <view class="section">
    <view class="title">Type</view>
    <button type="default">default</button>
    <button type="primary">primary</button>
    <button type="warn">warn</button>
  </view>
  <view class="section" style="background:#ddd;">
    <view class="title">Misc</view>
    <button type="default" plain>plain</button>
    <button type="default" disabled>disabled</button>
    <button type="default" loading={{true}}>loading</button>
    <button type="default" hover-class="red">hover-red</button>
  </view>
  <view class="section">
    <view class="title">Size</view>
    <button type="default" size="mini">mini</button>
  </view>
  <view class="section">
    <view class="title">Type</view>
    <form onSubmit="onSubmit" onReset="onReset">
      <button form-type="submit">submit</button>
      <button form-type="reset">reset</button>
    </form>
  </view>
</view>