网页前端设计

http://www.86y.org
feedskyQQ邮箱

搜索文章

微信小程序组件 使用button更有效的 打开客服会话

用声音读出全文关注我吧
 2017/11/6 10:04:41 阅读次数:408

一概述:

本文不介绍如何开启客服,而是如何打开客服会话,本来使用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)一起学习进步:【幸凡前端技术交流群】
如需转载请注明出处:http://www.86y.org/art_detail.aspx?id=841【微信小程序组件 使用button更有效的 打开客服会话】幸凡学习网
0

如果您觉得本文的内容对您的学习有所帮助,捐赠与共勉,支付宝(左)或微信(右)

阅读全文内容关闭