本文主要是介绍uniapp+vue3的ifdef实现多端配置客服消息，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
在微信小程序预览，实现客服消息，因是个人版，不支持
button | uni-app官网 (dcloud.net.cn)
条件编译处理多端差异 | uni-app官网 (dcloud.net.cn)
uni.makePhoneCall(OBJECT) | uni-app官网 (dcloud.net.cn)
//my.vue
<template>
<view class="list"><view class="section"><view class="row"><view class="left"><uni-icons class="symbel" type="download-filled" size="20" color="#21b589"></uni-icons><text>我的下载</text></view><view class="right"><text>0</text><uni-icons type="right" class="arrow_right" size="15" color="#a9a9a9"></uni-icons></view></view><view class="row"><view class="left"><uni-icons class="symbel" type="star-filled" size="20" color="#21b589"></uni-icons><text>我的评分</text></view><view class="right"><text>0</text><uni-icons type="right" class="arrow_right" size="15" color="#a9a9a9"></uni-icons></view></view><view class="row"><view class="left"><uni-icons class="symbel" type="person-filled" size="20" color="#21b589"></uni-icons><text>联系客服</text><!-- 仅出现在 MP 平台下的代码 --><!-- #ifdef MP --><button open-type="contact" class="contect_with">联系客服</button><!-- #endif --><!-- 仅出现在 H5 平台下的代码 --><!-- #ifdef H5--><button @click="clickContact" class="contect_with">拨打电话</button><!-- #endif --></view><view class="right"><text>0</text><uni-icons class="arrow_right" type="right" size="15" color="#a9a9a9"></uni-icons></view></view></view></view>
</template>
<script setup>
// 拨打电话const clickContact=()=>{uni.makePhoneCall({phoneNumber:'13047585784'})}
</script>
<style lang="scss" scoped>
.list{width: 690rpx;margin: 0 30rpx 30rpx;border: 1rpx solid #eee;box-shadow: 0 0 30rpx rgba(0,0,0,0.05);//阴影border-radius: 10rpx;.section{.row{display: flex;justify-content: space-between;// align-items: center;height: 100rpx;border-bottom: 1px solid #eee;position: relative;&:last-child{border-bottom: 0 ;}.left{display: flex;align-items: center;color: #595959;.symbel{margin: 0 30rpx;}.contect_with{position: absolute;left: 0;top: 0;width: 100%;height: 100rpx;opacity: 0;}}.right{display: flex;align-items: center;color: #a9a9a9;.arrow_right{margin-right: 30rpx;}}}}}
</style>这篇关于uniapp+vue3的ifdef实现多端配置客服消息的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
