前言

开发微信小程序时，有个需求是在【我的】页面跳转到客服会话，由于页面中用的是t-cell组件，而t-cell组件又没有open-type，无法直接跳转到客服会话。

思路

小程序的open-type只能通过button来触发，所以解决思路就是在t-cell中叠加一个button来实现跳转到客服会话的需求。

实现过程

wxml

定义一个view，在view里面包含两个组件t-cell和button

<view class="cell-wrapper">
  <t-cell title="联系客服" leftIcon="service" hover />
  <button class='contact-btn' open-type='contact'>按钮</button>
</view>

wxss

包装类cell-wrapper，布局为flex，按钮的布局为inline-block并且全透明

.cell-wrapper{
  display: flex;
}
.contact-btn {
  display: inline-block;
  position: absolute;
  width: 100%;
  background: blueviolet;
  opacity: 0;
}

最终效果

点击前

为了看到效果，这里暂时把透明度设置为opacity：0.5;

点击后

触发了客服会话弹窗，需要再真机才能看到实际效果