展示功能小程序(后期更新后台接口调用)

下拉列表:

展开前

展开后

//.wxml文件

<view class="page">

<view class="page_bd">

<view class="body_head" bindtap="showitem">展开全部信息</view>

<navigator url="">

<view class="{{open?'display_show':'display_none'}}" bindtap="calling" ><image class='call' src='../image/call.png' ></image> 电话:

</view>

</navigator>

<navigator url="" >

<view bindtap='copyText' data-text="{{contents}}" class="{{open?'display_show':'display_none'}}"><image class='call' src='../image/weixin.png' ></image> 微信:11</view>

</navigator>

<navigator url="">

<view class="{{open?'display_show':'display_none'}}"><image class='call' src='../image/gonsi.png' ></image> 公司:广

</navigator>

<navigator url="">

<view bindtap='copyText' data-text="{{ff}}" class="{{open?'display_show':'display_none'}}"><image class='call' src='../image/dizhi.png' ></image> 地址:广东省广州市

</view>

</navigator>

</view>

</view>

//.wxss

.page_bd{

padding: 10px;

background-color: snow;

}

.body_head{

border: 1px solid;

border-color: beige;

padding: 10px;

display: flex;

justify-content: center;

font-size: 10px;

}

.display_show{

display: block;

border: 1px solid;

border-color: beige;

padding: 10px;

font-size: 15px;

}

.display_none{

display: none;

}

.img-plus-style {

height: 70rpx;

width: 70rpx;

position: fixed;

bottom: 220rpx;

right: 30rpx;

opacity: 0.7

}

.img-plus-style1 {

height: 50rpx;

width: 50rpx;

position: fixed;

bottom: 130rpx;

right: 30rpx;

opacity: 0.7

}

.zindex100{z-index: 100}

.yc{opacity: 0}

复制功能:

//.js

Page({

data: {

// text:"这是一个页面"

open: false,

contents: '18588712461',

ff: '广东省',

},

copyText: function (e) {

console.log(e)

wx.setClipboardData({

data: e.currentTarget.dataset.text,

success: function (res) {

wx.getClipboardData({

success: function (res) {

wx.showToast({

title: '复制成功'

})

}

})

}

})

},

///////////////////////////////

地图标注:

//.wxml

<view class="page-section page-section-gap">

<map

id="myMap"

style="width: 100%; height: 300px;"

latitude="555"

longitude="45"

markers="{{markers}}"

covers="{{covers}}"

show-location

></map>

</view>

</view>

//.js

data: {

markers: [{

id: 1,

latitude: 554,

longitude: 44,

name: '恒503'

}],

需要源码请QQ联系:1174787689

猜你喜欢

转载自blog.csdn.net/weixin_42401291/article/details/83819329