微信开发这块,作为开发工程师来说,一般是避免不了的,也好像发现一些朋友写微信分享都是在每个页面一大把一大把的代码。

代码冗余,即便是复制过来再改也很麻烦。

之前自己封装了一下js,今天来分享一下,希望能给看到的园友带来一点思路,当然希望能帮忙一起改进。

我的思路:

  1.可以分享到四个地方QQ,朋友,朋友圈,微博,一般情况下他们是一致的,可以配置一个初始参数,赋值给它们四个

  2.如果出现不一致,因为前面已经赋值了初始参数,这时再把需要不一致的内容替换掉

实现主要代码:

setData: function(){
var self = this;
self.data = {
title: self.title,
desc: self.desc,
link: self.link,
imgUrl: self.imgUrl,
type: self.type, // 分享类型,music、video或link,不填默认为link
dataUrl: self.dataUrl, // 如果type是music或video,则要提供数据链接,默认为空
success: self.success,
cancel: self.cancel
};
//深度克隆
self.QQData = JSON.stringify(self.data);
self.QQData = JSON.parse(self.QQData);
self.TimeLineData = JSON.stringify(self.data);
self.TimeLineData = JSON.parse(self.TimeLineData);
self.WeiBoData = JSON.stringify(self.data);
self.WeiBoData = JSON.parse(self.WeiBoData);

      //反序列化
      self.QQData.success = self.success;
       self.TimeLineData.success = self.success;
          self.WeiBoData.success = self.success;
          self.QQData.cancel = self.cancel;
          self.TimeLineData.cancel = self.cancel;
          self.WeiBoData.cancel = self.cancel;

    }

wx.ready(function(){
  wx.showOptionMenu();
  if(self.data == '') self.setData();
  wx.onMenuShareQQ(self.QQData);
  wx.onMenuShareAppMessage(self.data);
  wx.onMenuShareTimeline(self.TimeLineData);
  wx.onMenuShareWeibo(self.WeiBoData);

});

使用帮助:

var wxshare = require('wxshare.js');

如果分享的内容都一致

wxshare.link = '';
wxshare.desc = '';
wxshare.imgUrl = '';
wxshare.type = '';
wxshare.dataUrl = '';
wxshare.start();

如果有不一致,针对不一致的地方进行修改

wxshare.link = '';
wxshare.title = '';
wxshare.desc = '';
wxshare.imgUrl = ''; wxshare.setData();//必须加上
wxshare.TimeLineData.title = '';
wxshare.QQData.desc = '';
wxshare.start();

重点说明: setData()

如果全部的分享内容都一样,直接执行start(), 判断data参数空为true,会执行setData(),
为四个分享赋值:QQData data TimeLineData WeiboData, 而后初始化

如果有不一致,首次赋值后,直接调用setData(),为四个参数赋值,之后再根据需求修改不同的对应参数,最后start()初始化。

--------------------------------------------------------------------------------------------------------------------------------------------

具体代码 github 地址:  >>>>>>>>>>戳我、戳我、戳我、戳我、戳我<<<<<<<<<<<<

JS微信分享不好写?来封装一下的更多相关文章

  1. js 微信分享

    一. //js接口 var shareme; var urls = window.location.href; if(isWeiXin()){   var weifileref=document.cr ...

  2. javascript获取wx.config内部字段解决微信分享

    转自:http://www.jb51.net/article/80679.htm 专题推荐:js微信开发_脚本之家 http://www.jb51.net/Special/879.htm 背景在微信分 ...

  3. php框架tp3.2.3和js写的微信分享功能心得,分享的标题内容图片自定义

    https://blog.csdn.net/weixin_42231483/article/details/81585322 最近用PHP的tp3.2.3框架和js写的微信分享功能心得,分享的标题内容 ...

  4. 封装微信分享到朋友/朋友圈js

    在页面引入: <script src="/static/lib/jquery-2.2.2.min.js"></script><script src=& ...

  5. 微信分享JS接口失效说明及解决方案

    关键字:微信分享 JS 失效  分享到朋友圈 微信分享JS接口目前已失效,以前可以自定义分享的标题.描述.图片.链接地址在微信6.0.2版本中失效. 官方回复如下: 旧版的获取分享状态及设置分享内容的 ...

  6. 微信开发(2):微信js sdk分享朋友圈,朋友,获取config接口注入权限验证(转)

    进行微信开发已经一阵子了,从最初的什么也不懂,到微信授权登录,分享,更改底部菜单,素材管理,等. 今天记录一下微信jssdk 的分享给朋友的功能,获取config接口注入. 官方文档走一下简单说:四步 ...

  7. js实现通用的微信分享组件示例

    一.可定义的信息 1.分享时显示的LOGO:2.分享LOGO的宽度:3.分享LOGO的高度:4.分享出去显示的标题(默认调用网页标题):5.分享出去显示的描述(默认调用网页标题):6.分享链接(默认为 ...

  8. weixinShare.js / 极简微信分享插件

    weixinShare.js / 极简微信分享插件 / 版本:0.1 这是一个很简单.很实用的微信分享插件,无需jQuery,只需要在网页里加入一行JS代码,即可自动识别微信浏览器并启动微信分享的提示 ...

  9. vue 使用vux封装的微信分享

    main.js引入 import {WechatPlugin} from 'vux' Vue.use(WechatPlugin) 公共的jswxShare.js import Vue from 'vu ...

随机推荐

  1. 移动APP的IM后台架构浅析

    IM(InstantMessaging 即时通讯)作为一项基础功能,很多APP都有,比如:手机QQ.微信.易信.钉钉.飞信.旺旺.咚咚.陌陌等.而IM如同我们日常生活中的水和电一样,必不可少,也是很多 ...

  2. 【VerySky原创】怎样查找到CDHDR、CDPOS表中的OBJECTCLAS字段

    可以通过pooled table TCDOB - Objects for change document creation 找到对应的表的对象值: se38 run:  RSSCD1TS object ...

  3. Passwordless SSH Login

    原文地址:http://manjeetdahiya.com/2011/03/03/passwordless-ssh-login/ Consider two machines A and B. We w ...

  4. Scala 深入浅出实战经典 第45讲: scala中context bounds代码实例

    王家林亲授<DT大数据梦工厂>大数据实战视频 Scala 深入浅出实战经典(1-64讲)完整视频.PPT.代码下载:百度云盘:http://pan.baidu.com/s/1c0noOt6 ...

  5. Codeforces Round #382 (Div. 2)B. Urbanization 贪心

    B. Urbanization 题目链接 http://codeforces.com/contest/735/problem/B 题面 Local authorities have heard a l ...

  6. java.lang.IllegalArgumentException: You must not call setTag() on a view Glide is targeting

    将原有项目图片加载框架picasso改为glide,关于picasso和glide文档就自行查阅相关资料 显示 图片 例子 Glide.with(mContext).load(imageUrl).pl ...

  7. java 方法调用绑定

    将一个方法调用同一个方法主体关联起来被称作绑定.若在程序执行前进行绑定(由编译器和连接器实现),叫做前期绑定.读者可能从来没有听说过这个术语,因为它在面向过程语言中不需要选择就默认的绑定方式.例如C语 ...

  8. [开发笔记]-MarkDown语法

    马克飞象MarkDown在线编辑器 http://maxiang.info/?basic 1. H1--H6 相应数量的# 2. 底线形式 = H1(最高阶标题)和- H2(第二阶标题) 3. 段落和 ...

  9. 解决Windows Server2008 R2中IE开网页时弹出阻止框(Windows Server2008网页无法打开的问题)

    相信使用Windows Server2008的朋友都遇到过这种情况,用IE打开网站时会弹出“Internet Explorer增强安全配置正在阻止来自下列网站的此应用程序中的内容”的对话框.如下图所示 ...

  10. MMS关键指标意义&各数值区间意义

    MMS关键指标意义&各数值区间意义 What's MMS MongoDB Management Service (MMS) is a suite of services for managin ...