微信小程序分享功能实现的两种方式 注意第二种是通过open-type来实现

微信小程序分享功能的实现方法有两种：

第一种

在页面中实现onShareAppMessage，便可在小程序右上角选择分享该页面

**

  onShareAppMessage(res) {
			console.log(res);
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: '租赁详情', //自定义分享标题
				path: `/pagesA/officeLease/officeDetail?id=${this.id}`, // '/pages/...'分享页面路径（打开分享时进入页）
				imageUrl: '', //可设置默认分享图，不设置默认截取头部5:4
        success: function(res) {
          console.log('分享成功')
        },
			}
		}, 

第二种

注意

1. open-type只会在button上使用才会生效 ,
2. 自定义按钮实现分享，在page中添加一个带有open-type='share'的button标签()。点击该按钮后，即会自动触发已定义好的onShareAppMessage方法，实现分享功能。
3. 由于button的样式是个按钮 ,需要自己修改下样式,把边框都去掉已经修改背景色即可

      <view class="button_b">
        <view>
          <u-icon name="zhuanfa" color="#000" size="35"></u-icon>
          <view style="margin-left: -20rpx;">
            <u-button open-type='share' :plain="true" size="mini" :hair-line="false" :custom-style="customStyle">分享
            </u-button>
          </view>
        </view>
        <view class="btn" @click="getPhoneFn">电话咨询</view>
      </view>
      

  data () {
    return {
      customStyle: {
        background: 'transparent',
        color: '#000',
        border: 'none',
      },

    }
  },
  onShareAppMessage (res) {
    return {
      title: '租赁详情', //自定义分享标题
      path: `/pagesA/officeLease/officeDetail?id=${this.id}`, // '/pages/...'分享页面路径（打开分享时进入页）
      imageUrl: '', //可设置默认分享图，不设置默认截取头部5:4
      success: function(res) {
        console.log('分享成功')
      },
    }
  },
methods: {
  getPhoneFn () {
      wx.makePhoneCall({
        // phoneNumber: this.detailLists.mobile,
        phoneNumber: '+86 18219109886',
        success: function() {
          console.log("拨打电话成功！")
        },
        fail: function() {
          console.log("拨打电话失败！")
        }
      })
    },
  }



<style lang="scss" scoped>
 .button_b {
    width: 90%;
    padding: 20rpx;
    position: fixed;
    bottom: 60rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 999;

    .btn {
      width: 590rpx;
      height: 90rpx;
      line-height: 90rpx;
      text-align: center;
      background: #eb7f36;
      border-radius: 58rpx;
      color: #fff;
    }
  }
  </style>