WeChat小程序表单篇~button

button按钮

解释:

小程序的button按钮，常用于与用户交互使用。

属性:

button属性

属性名	类型	默认值	说明	注释
size	String	default	按钮的大小	类型String,不是Number 只有default、mini,下文有解释
type	String	default	按钮展示的样式	下文有解释
plain	Boolean	false	按钮是否镂空,背景色透明
disabled	Boolean	false	按钮是否禁用,不可点击
loading	Boolean	false	名称前是否带loading图标
----以上为常用----
form-type	String		用于form组件的按钮(submit/reset)	下文有解释
open-type	String		微信开发能力(分享，获取用户信息，客服聊天)
---button动作----
hover-class	String	button-hover	按钮按下去的样式类，当hover-class="none"，没有点击效果
hover-stop-propagation	Boolean	false	阻止父节点出现点击态
hover-start-time	Number	20	按住多久出现点击态，(毫秒)
hover-stay-time	Number	20	松开后点击保留时间,(毫秒)

size有效值

值	说明
default	默认值
mini

type有效值

值	说明
primary	原色值
default	默认值
warn	警告值

form-type有效值

值	说明
submit	提交表单
reset	重置表单

open-type有效值

值	说明
contact	打开客服,需要小程序后台配置
share	打开分享面板
getUserInfo	可以在bindgetuserinfo中回调获取用户信息
getPhoneNumber	可以在bindgetphonenumber回调中获取用户信息
launchApp	打开App 可以通过app-parameter属性设置向app传的参数

展示

button展示效果

使用:

  
      
      按钮原色
      按钮Loading
      不可点Disabled
      
      默认值
      默认值Disabled
      
      警告类
      警告类操作 Disabled

      
        镂空按钮
        不可点击

        按钮
        不可点按钮

      
        按钮
        按钮
        按钮
      
        朋程
      
    

---

附上资源☺☟☟

小程序官方示例代码
文中代码均对小程序官方示例代码做出过修改,包括添加注释,新加代码测试。
本文代码示例
小程序wiki