uni-app——uniapp 自定义按钮分享好友

最新推荐文章于 2024-05-11 09:18:20 发布

dbt@L

最新推荐文章于 2024-05-11 09:18:20 发布

阅读量921

点赞数 7

分类专栏： uni-app 文章标签： uni-app

本文链接：https://blog.csdn.net/qq_43201350/article/details/135759791

版权

uni-app 专栏收录该内容

75 篇文章 2 订阅

订阅专栏

<template>
  <view class="content">
    <!-- 自定义图标 -->
    <image
      class="share-icon"
      src="@/static/demo.png"
      mode="aspectFit"
    ></image>
    <view>微信好友</view>
    <button open-type="share" id="shareBtn">分享</button>
  </view>
</template>

<style lang="">
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 24rpx;
  padding-bottom: 40rpx;
  margin-bottom: 24rpx;
  border-radius: 50%;
  position: relative;

  .share-icon {
    margin-bottom: 20rpx;
    width: 80rpx;
    height: 80rpx;
  }
  #shareBtn {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
  }
}
</style>