小程序
小游戏
企业微信
微信支付
扫描小程序码分享
我们的需求是这样的》 客户留了一段备注信息,里面可能会有手机号(可能是多个号码),怎么才能识别出手机号,并且手机号要能高亮显示,当用户看到手机号的时候,直接点击手机号就可以拨打电话了,这样的功能App里面很好实现,但是小程序怎么实现呢。
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
正则匹配留言,找出电手机号码,结合wx.makePhoneCall
// 下面这段比较繁琐
var a = '15900000001一二15900000002三四15900000003五六15900000004', b = a.match(/(1\d{10})/g),c = a.split(/(?:1\d{10})/),list = []
for (var i in c){
if (c[i] == '') {
i == 0 && list.push({ type: 'phone', val: b[0] })
} else {
list.push({ type: 'text', val: c[i] })
list.push({ type: 'phone', val: b[i] })
}
// ===================================
// 下面这段比较简洁一点
var a = '15900000001一二15900000002三四15900000003五六15900000004', c = a.split(/(?:1\d{10})/),list = []
var flag = c[i] != '' && /^(1\d{10})$/.test(c[i])
c[i] != '' && list.push({ type: flag ? 'phone' : 'text', val: c[i] })
// ======================
this.setData({
list: list
})
console.log(list)
==============================
<view wx:for="{{list}}" wx:key bindtap="{{item.type=='phone'?'makePhoneCall':''}}" data-phone="{{item.type=='phone'?item.val:''}}">{{item.val}}</view>
makePhoneCall: function (e) {
wx.makePhoneCall({
phoneNumber:e.currentTarget.dataset.phone
最后在慢慢调整样式吧
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
1、用正则表达式A匹配留言的字符串,取出手机号数组 phoneList
2、用split方法,加刚刚的正则表达式A,拆分留言成字符串数组 strList。
3、界面上用循环显示
<block wx:for="{{strList}}">
<text>{{item}}</text>
<text bindtap="call" data-phone="{{phoneList[index]}}" wx:if="{{phoneList[index]}}">{{phoneList[index]}}</text>
</block>
拨电话wx.makePhoneCall
可以先处理字符串,大致分为文字(text)和 电话(tel),然后再循环渲染出来就可以
// 字符串截取生成一个大概这样的数组
let list = [{
phoneNumber: true,
content: '10086'
},{
phoneNumber: false,
content: '不是电话号码,'
}]
// 然后渲染,绑定事件
<view class="content" wx:for="{{list}}" wx:key="{{index}}">
<view wx:if="{{item.phoneNumber}}" bindtap="makePhoneCall" data-tel="{{item.content}}">{{item.content}}</view>
<view wx:else>{{item.content}}</view>
</view>
// 打电话方法
makePhoneCall: function(e) {
phoneNumber: e.currentTarget.dataset.tel
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
正则匹配留言,找出电手机号码,结合wx.makePhoneCall
// 下面这段比较繁琐
var a = '15900000001一二15900000002三四15900000003五六15900000004', b = a.match(/(1\d{10})/g),c = a.split(/(?:1\d{10})/),list = []
for (var i in c){
if (c[i] == '') {
i == 0 && list.push({ type: 'phone', val: b[0] })
} else {
list.push({ type: 'text', val: c[i] })
list.push({ type: 'phone', val: b[i] })
}
}
// ===================================
// 下面这段比较简洁一点
var a = '15900000001一二15900000002三四15900000003五六15900000004', c = a.split(/(?:1\d{10})/),list = []
for (var i in c){
var flag = c[i] != '' && /^(1\d{10})$/.test(c[i])
c[i] != '' && list.push({ type: flag ? 'phone' : 'text', val: c[i] })
}
// ======================
this.setData({
list: list
})
console.log(list)
==============================
<view wx:for="{{list}}" wx:key bindtap="{{item.type=='phone'?'makePhoneCall':''}}" data-phone="{{item.type=='phone'?item.val:''}}">{{item.val}}</view>
==============================
makePhoneCall: function (e) {
wx.makePhoneCall({
phoneNumber:e.currentTarget.dataset.phone
})
}
最后在慢慢调整样式吧
var a = '15900000001一二15900000002三四15900000003五六15900000004',
c = a.split(/(1\d{10})/),list = []
for (var i in c){
var flag = c[i] != '' && /^(1\d{10})$/.test(c[i])
c[i] != '' && list.push({ type: flag ? 'phone' : 'text', val: c[i] })
}
1、用正则表达式A匹配留言的字符串,取出手机号数组 phoneList
2、用split方法,加刚刚的正则表达式A,拆分留言成字符串数组 strList。
3、界面上用循环显示
<block wx:for="{{strList}}">
<text>{{item}}</text>
<text bindtap="call" data-phone="{{phoneList[index]}}" wx:if="{{phoneList[index]}}">{{phoneList[index]}}</text>
</block>
拨电话wx.makePhoneCall
可以先处理字符串,大致分为文字(text)和 电话(tel),然后再循环渲染出来就可以
// 字符串截取生成一个大概这样的数组
let list = [{
phoneNumber: true,
content: '10086'
},{
phoneNumber: false,
content: '不是电话号码,'
}]
// 然后渲染,绑定事件
<view class="content" wx:for="{{list}}" wx:key="{{index}}">
<view wx:if="{{item.phoneNumber}}" bindtap="makePhoneCall" data-tel="{{item.content}}">{{item.content}}</view>
<view wx:else>{{item.content}}</view>
</view>
// 打电话方法
makePhoneCall: function(e) {
wx.makePhoneCall({
phoneNumber: e.currentTarget.dataset.tel
})
}