微信小程序实现拨打电话功能的示例代码

站长资源 2024/12/26 佚名

1 1538 1

DDR爱好者之家 Design By 杰米

1、在对应需要拨打电话的标签那里绑定事件（使用的标签不固定，可以是text、view等）

例子：

<text class="phone" bindtap="callPhone">400-9121-211</text>

2、在对应的事件方法里面写入 wx.makePhoneCall方法

例子：

callPhone() {
 wx.makePhoneCall({
  phoneNumber: '400-9121-211' //仅为示例，并非真实的电话号码
 })
 },

3、效果图

在电脑上：

在手机上的效果：

PS：下面在通过一段代码给大家详细介绍下微信小程序--实现拨打电话功能：

我的点击实物是一张图片

首先设置一个view，使用的是bindtap事件。

官方的开发文档是这么写的

我的demo的代码是这样的
index.wxml

<view bindtap='tel'>
<image class='tel' mode='aspectFit' src='./img/tel.png'></image>
</view>

然后调整一下ss，当然这只是我的demo的，实际应用还是看实际的。

index.wxss

.tel{
 display: block;
 width: 70rpx;
 height: 70rpx;
 position: absolute;
 margin-top:-100rpx;
 margin-left: 200rpx; 
}

直接去调用拨打电话 APIwx.makePhoneCall(OBJECT)

官方文档也写的很清楚

主要是填写phoneNumber，其他看需求，

第一种方法是：

index.js的Page里面去添加

tel:function () {
 wx.makePhoneCall({
 phoneNumber: '158XXXXXXXX',
 })
}

还有一种是：
就是去全局量那里设置，去最外层的app.js的globalData添加一下

globalData: {
 userInfo: null,
 phoneNumber: '158XXXXXXXX'
}

然后index.js添加的是

tel:function () {
 wx.makePhoneCall({
 phoneNumber: app.globalData.phoneNumber,
 })
}

然后保存点击

嗯嗯，还是应该多看看开发文档，即使不完整。

微信小程序拨打电话,小程序拨打电话

DDR爱好者之家 Design By 杰米

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！

DDR爱好者之家 Design By 杰米

评论“微信小程序实现拨打电话功能的示例代码”

暂无评论...

P70系列延期，华为新旗舰将在下月发布

3月20日消息，近期博主@数码闲聊站透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。

而博主@定焦数码爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？
根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。

更新日志

2024年12月26日

微信小程序实现拨打电话功能的示例代码

详细分析Node.js 模块系统

js瀑布流布局的实现

评论“微信小程序实现拨打电话功能的示例代码”

P70系列延期，华为新旗舰将在下月发布

更新日志

友情链接