效果图:
使用的方法:
https://developers.weixin.qq.com/miniprogram/dev/api/device/phone/wx.makePhoneCall.html
Demo:
<template>
<view class="sunSetPage">
<image src="{{url}}" mode="aspectFit"></image>
<view class="makePhone" @click="phoneCall()"></view>
</view>
</template>
<script>
export default {
data() {
return {
url: '../../static/sunset.jpg',
phone: '4008700087'
}
},
methods: {
phoneCall(){
wx.makePhoneCall({
phoneNumber: this.phone
})
}
}
};
</script>
<style scoped lang="scss">
.sunSetPage{
position: relative;
width: 100%;
height: 100%;
image{
width: 100%;
height: 100%;
}
.makePhone{
position: absolute;
top: 54vh;
right: 6vh;
width: 200rpx;
height: 100rpx;
}
}
</style>