• webapp项目vue框架点击按钮实现微信好友分享,朋友圈分享


    当时做这个这个效果真把人给*了,网上能搜到的基本是微信页面的分享,特征是方法是wx.**开头,不适用于app内。思路都是一样的,先调取服务(这里使用plus的内置方法),再发送分享请求

    <template>

        <div class="" id="share" v-for="(items,index) in strands" :key="index" @click="wxShare(index)">   //使用循环,渲染出点击分享朋友圈和好友的按钮,方便获取index。一切从这开始的
                 <img v-if="index==0" src="../assets/img/gg/wChart.png" alt="">
                 <img v-if="index==1" src="../assets/img/gg/circle.png" alt="">
            <span>{{items.flag}}</span>  
        </div>
    </template>
    data(){
            return{
                strands:[{flag:'微信好友'},{flag:'朋友圈'}]
            }
        },
    methods:{
      wxShare(index){
                let msg = {}
                    msg.type='web'                                                             //这个要加,至于为什么咱也不敢问
                    msg.title='XX软件名'
                    msg.content='这里填一些分享信息,是在好友还未点进去看到的信息'
                    msg.thumbs=['../assets/img/alert/logo.png']                 //打包进app的本地applogo
                    msg.href='https://www.baidu.com/'                              //好友点进去需要跳转的连接
                if(index==0){
                    msg.extra={scene:"WXSceneSession"}                      //好友分享
                }else if(index==1){
                    msg.extra={scene:"WXSceneTimeline"}                     //朋友圈分享
                }
               plus.share.getServices(function(e) {                            //移动端获取服务,这里的plus方法只能在移动端有效,在pc端运行会报plus错误,下一步就该打包检验
                  this.shareData = e                               //这个回调函数的参数 e 就包含了所有对象的数组
                  for(var i in e){        
                      if('weixin' == e[i].id){
                          this.sharewx = e[i]  
                      }
                  }
              })
               // 使用send发起分享
                this.sharewx.send(msg,function(){
         alert('分享成功')                              //这里有个问题就是这个方法是异步的,一旦app内需要在分享成功或失败后发起请求的话需要解决异步问题
              },function(error) {
                   alert('分享失败')
           })

     注:如果失败应该是未获取授权,请先实现微信登录

  • 相关阅读:
    测试用例怎么写
    002-利润计算
    001-无重复数字组合
    ftp上传与gui button的练习
    文件操作
    py2exe制作python可执行.exe的setup.py
    猜数字大小的游戏
    GUI简单例子学习
    新的旅程
    回车键搜索兼容性问题
  • 原文地址:https://www.cnblogs.com/wd163/p/12212886.html
Copyright © 2020-2023  润新知