<view class="icon-item">
<view class="icon-img">
<image :src="`${imgurl}/onlineApplet/applet3/followlist/share.png`"></image>
</view>
<view class="icon-text">分享主页</view>
<button open-type="share" id="shareBtn" ></button>
</view>
<style lang="scss" scoped>
/**
* 给按钮设置一个绝对定位 让按钮覆盖.icon-item元素
*/
#shareBtn {
width: 100%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
}
.icon-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-right: 48rpx;
position: relative;
.icon-img {
width: 100rpx;
image {
width: 100rpx;
height: 100rpx;
}
}
.icon-text {
font-family: PingFang SC;
font-weight: 500;
font-size: 24rpx;
color: #222222;
}
}
</style>