一文教会你|uniapp微信小程序分享怎么写?uniapp 微信小程序当前页面未设置分享?

肥晨

发布于 2024-07-12 17:27:18

5360

发布于 2024-07-12 17:27:18

文章被收录于专栏：农民工前端

导文

❝uniapp 微信小程序当前页面未设置分享？ uniapp 微信小程序分享到好友怎么写？ uniapp微信小程序分享怎么写？分享转发文件到聊天（转发至好友、群聊等）点击按钮转发怎么写？

当前页面未设置分享？

没有开分享的时候，默认状态下是显示：当前页面未设置分享

配置

打开项目的manifest.json文件，在“App模块配置”项的“Share(分享)”下，勾选“微信分享”：

在代码中开启分享转发按钮

shareAppMessage是转发给朋友或者转发给群shareTimeline是转发到朋友圈

<script>
 export default {
  created() {
   //#ifdef MP-WEIXIN
   wx.showShareMenu({
    withShareTicket: true,
    menus: ['shareAppMessage', 'shareTimeline']
   });
   //#endif
  },
  data() {
   return {
    title:'标题',
    thumb:'.../images.jpg'
   }
  },
  onShareAppMessage(res) { //发送给朋友
   return {
    title: this.title,
    imageUrl: this.thumb,
   }
  },
  onShareTimeline(res) { //分享到朋友圈
   return {
    title: this.title,
    imageUrl: this.thumb,
   }
  },
  methods: {
  }
 }
</script>

在这里插入图片描述

点击按钮转发怎么写

监听用户点击页面内转发按钮（button 组件 open-type="share"）

<button open-type="share">分享按钮</button>

并自定义转发内容(在methods中有onShareAppMessage函数就行）

   onShareAppMessage(res) {
            if (res.from === 'button') {// 来自页面内分享按钮
                console.log(res.target)
            }
            return {
                title: '...',
                path: `/pages/.../index`
            }
        },