微信小程序自带客服聊天功能实现（两种样式解读）

最新推荐文章于 2024-07-24 09:29:32 发布

丶枕边人

最新推荐文章于 2024-07-24 09:29:32 发布

阅读量9.9k

点赞数 8

分类专栏：微信小程序文章标签：小程序

本文链接：https://blog.csdn.net/nan961136007/article/details/103911818

版权

本文介绍了微信小程序中实现客服聊天功能的两种方法。第一种方法样式固定，但可以通过修改代码进行调整。第二种方法样式更美观，允许自定义。通过展示WXML和WCSS代码，并解释注意事项，如设置为none以隐藏边框。此外，添加阴影效果提升视觉体验。完成代码编写后，需在小程序后台配置客服信息，绑定微信号，即可接收到客服消息。

摘要由CSDN通过智能技术生成

	小程序自带的聊天功能有两种表现方式，一种是不能调整样式的，另外一种是自己调整样式的。
这种微信自做的API是不需要后台的，而且实现方法很简单，但是也有弊端。

第一种是

<contact-button type="default-dark" size="20" session-from="weapp"></contact-button>

在这里插入图片描述

就这一句代码，实现了就是这样子的，看着是不是很尴尬，哈哈，这个样式也不是说调不了，就是样子改不掉。

第二种呢，和第一种代码差不多，也很少，但是呢，样子就好看多了，还能够自己调整。
上代码和图片

wxml

<button class="ke-fu" open-type="contact" bindcontact="handleContact">
<!-- img是你们的图片 -->
  <image class="kefu-img" src="/pages/images/in_logo7.png"></image>
  <view class="kf-kf">客服</view>
</button>

wcss