H5APP中使用vue拨打用户电话
简单粗暴调用函数直接调用这个函数就可以了,//拨打电话GetPhone(){if (window.plus) {plus.device.dial(‘要拨打的电话号’, true);}},这个弹窗是基于vux,要用弹窗的话可以下载vux,不要的话不用往下看了,手机号我也不知道谁的,看见了...
·
简单粗暴调用函数
直接调用这个函数就可以了,
//拨打电话
GetPhone(){
if (window.plus) {
plus.device.dial(‘要拨打的电话号’, true);
}
},
这个弹窗是基于vux,要用弹窗的话可以下载vux,不要的话不用往下看了,手机号我也不知道谁的,看见了别乱打。。。。。
npm install vux --save
在build/webpack.base.conf.js要进行修改的代码
const vuxLoader = require('vux-loader')
const webpackConfig = originalConfig // 原来的 module.exports 代码赋值给变量 webpackConfig
module.exports = vuxLoader.merge(webpackConfig, {
plugins: ['vux-ui']
})
咳咳
<p @click="Call">拨打电话</p>
<popup v-model="isDetail" height="1.34rem">
<div class="Img">
<p>拨打电话</p>
<span>确认要拨打电话{{Mobile}}吗?</span>
<div class="qu" @click="GetPhone">确定</div>
<div class="CloseT" @click="CloseT">关闭</div>
</div>
</popup>
函数调用:
<script>
import { Swiper,Popup} from 'vux'
export default {
components: {
Swiper,Popup
},
name: "about",
data(){
return{
isDetail:false,
Mobile:''
}
},
methods:{
//拨打电话
GetPhone(){
if (window.plus) {
plus.device.dial(this.Mobile, true);
}
},
//隐藏电话弹窗
CloseT(){
this.isDetail = false
},
//展示电话弹窗
ShowK(){
this.isDetail = true
},
},
}
</script>
css
.vux-popup-dialog{
width: 2.8rem;
position: fixed;
left: 50%;
top: 50%;
margin-left: -1.4rem;
margin-top:-0.67rem;
.Img{
position: relative;
background: #fff;
width: 2.8rem;
height: 1.34rem;
overflow: hidden;
p{
font-size: .2rem;
text-align: center;
color: #414141;
line-height: .5rem;
}
span{
color: #666;
display: block;
font-size: .14rem;
text-align: center;
}
.qu{
width: .9rem;
font-size: .14rem;
text-align: center;
line-height: .3rem;
color: #fff;
height: .3rem;
position: absolute;
background: #37dcc9;
left: .25rem;
bottom: .2rem;
}
.CloseT{
width: .9rem;
font-size: .14rem;
text-align: center;
line-height: .3rem;
color: #fff;
height: .3rem;
position: absolute;
background: #999999;
right: .25rem;
bottom: .2rem;
}
}
}
我是一个很菜的前端美工!!!!!完毕!
更多推荐
已为社区贡献7条内容
所有评论(0)