Button 按钮
Button-外观样式
以下都是编译器自带的，也可以自己用CSS设计
- size： 按钮的⼤⼩
- type： 按钮的样式类型
- plain： 按钮是否镂空，背景⾊透明
- disabled： 是否禁⽤
- loading： 名称前是否带 loading 图标
- form- type： ⽤于 组件，点击分别会触发 组件的 submit/reset 事件
- open- type： 微信开放能⼒
<button>默认按钮</button>
<button size="mini">mini 按钮</button>
<button type="primary">primary 按钮</button>
<button type="warn">warn 按钮</button>
<button type="warn" plain="true">plain 按钮</button>
<button type="primary" loading="true">loading 按钮</button>
效果展示：
官网文档：https://developers.weixin.qq.com/miniprogram/dev/component/button.html
Button-开放能力
open- type标签
1、contact 打开客服会话，需要在微信小程序的后台配置，只能通过针剂调试打开
2、share 转发当前的小程序到微信好友，不能把小程序分享到朋友圈。使⽤前可先阅读使用指引
3、getPhoneNumber 获取当前的手机号码信息，结合一个事件来使用 不是企业的小程序号没有权限获取用户信息 具体说明
| 无权限 | 有权限 |
|---|---|
- 绑定一个事件 bindgetPhonenumber
- 在事件的回调函数中 通过参数来获取信息
- 获取到的信息 是加密过的
- 加密信息需要用户自己搭建小程序的后台服务器，在后台服务器中进行解析
| 拒绝 | 允许 |
|---|---|
4、getUserInfo 获取当前用户的个人信息。使用方法与getPhoneNumber 类似，不存在加密字段。（图中已经显示 昵称 城市 省份 性别:1代表男性）
5、launchApp 打开APP，可以通过app-parameter属性设定向APP传的参数具体说明
6、 openSetting 打开授权设置页面
7、 feedback 打开“意⻅反馈”⻚⾯，用户可提交反馈内容并上传日志
.wxml 文件
<button open-type="contact">contact</button>
<button open-type="share">share</button>
<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">getPhoneNumber</button>
<button open-type="getUserInfo" bindgetuserinfo="getUserInfo">getUserInfo</button>
<button open-type="launchApp">launchApp</button>
<button open-type="openSetting">openSetting</button>
<button open-type="feedback">feedback</button>
.js 文件
Page({
//获取用户的手机号码
getPhoneNumber(e){
console.log(e);
},
//获取用户信息
getUserInfo(e){
console.log(e);
}
})