一概述：
本文不介绍如何开启客服，而是如何打开客服会话，本来使用contact-button控件是可以实现的，介是有效区域太小，所以还是得找替换方法，button是可以支持的只是在测试的时候需要用真机打开才会有效果，所以很多人在用contact-button来做，什么多放一些contact-button来增大有效点击区域，真是太无语了。
二、以下是介绍两种使用方法：
1、使用button来打开客服会话(本人推荐)
button参数说明
<view class="deg">
<button open-type="contact" session-from="weapp">
<image src="/pages/images/m_service_ico.png" mode="widthFix"></image>客服
</button>
</view>
去掉button一些默认样式
.deg button{border:none;height:90rpx;background:none;border-radius:0;line-height:90rpx;color:#333;font-size:20rpx;text-align:center;}
.deg button:after{border:none;}
2、使用contact-button来打开客服会话
客服会话按钮，用于在页面上显示一个客服会话按钮，用户点击该按钮后会进入客服会话。
|
属性名 |
类型 |
默认值 |
说明 |
|
size |
Number |
18 |
会话按钮大小，有效值 18-27，单位：px |
|
type |
String |
default-dark |
会话按钮的样式类型 |
|
session-from |
String |
|
用户从该按钮进入会话时，开发者将收到带上本参数的事件推送。本参数可用于区分用户进入客服会话的来源。 |
type 有效值：
|
值 |
说明 |
|
default-dark |
|
|
default-light |
|
示例代码
<contact-button
type="default-light"
size="20"
session-from="weapp
">
</contact-button>
相关api：详见客服消息接口文档
三、结语：小程序真是一个奇葩的寄生体
大家有什么问题或技术上的想法可以在此与大家分享，也可以加入前端爱好者QQ群(141999928)一起学习进步：
【幸凡前端技术交流群】
如果您觉得本文的内容对您的学习有所帮助，捐赠与共勉，支付宝(左)或微信(右)