寫在前面：

剛做了一個微信端的網頁，用到了微信分享，在網上看了好多的資料，發現好多文件都寫得雲裡霧裡，讓人看的頭疼。通過對很多大佬文章的綜合整理，才完成了微信分享的部分。所以我想著自己寫一篇文章，能讓看到我這篇文章的親們能夠清楚的明白在vue上怎麼使用微信分享SDK，能夠按照我寫的步驟簡單粗暴的實現
備註：本人還是個菜鳥，剛剛接觸vue 文章中有錯誤或者大家對我有建議，隨意的提出來，我好改正，謝謝大家！

1.安裝sdk

  npm install weixin-js-sdk --save

2. 在main.js入口檔案中引入微信sdk

  import
 
 wx from 'weixin-js-sdk'

3.在main.js的生命週期函式（created()或mounted()）中引入微信sdk配置程式碼那就是全域性的，也可以在你想要分享的.vue元件中引入微信sdk配置程式碼這樣微信分享只在這個元件有效

4.通過config介面注入許可權驗證配置（一般後臺會提供介面，獲取介面後對應上就好，這個許可權驗證也可以放到一個公用js中這樣不同的元件都可以複用這個配置）

  wx.config({
    debug: true, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來，若要檢視傳入的引數，可以在pc端開啟，引數資訊會通過log打出，僅在pc端時才會列印。
 

    appId: '', // 必填，公眾號的唯一標識
    timestamp: , // 必填，生成簽名的時間戳
    nonceStr: '', // 必填，生成簽名的隨機串
    signature: '',// 必填，簽名
    jsApiList: [] // 必填，需要使用的JS介面列表
  });

5.通過ready介面處理成功驗證（如果每個元件要應用不同的分享內容那麼這個ready介面就在不同元件的生命週期函式中配置就好)

  wx.ready(function () {   //需在使用者可能點選分享按鈕前就先呼叫
  // 自定義“分享給朋友”及“分享到QQ”按鈕的分享內容（1.4.0）最新介面
 

    wx.updateAppMessageShareData({ 
        title: '', // 分享標題
        desc: '', // 分享描述
        link: '', // 分享連結，該連結域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
        imgUrl: '', // 分享圖示
        success: function () {
          // 設定成功
        }
  // 自定義“分享到朋友圈”及“分享到QQ空間”按鈕的分享內容（1.4.0）最新介面     
    wx.updateTimelineShareData({ 
        title: '', // 分享標題
        link: '', // 分享連結，該連結域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
        imgUrl: '', // 分享圖示
        success: function () {
          // 設定成功
        }
  });

本人也是VUE的菜鳥，謝謝大家檢視和使用本文件，如果文件中有什麼問題，希望大家能指正出來，我好及時修正，謝謝你