該方法需引入微信js-sdk ,先npm安裝
npm install weixin-js-sdk
html
????<div class="login_div">
? ????? <mt-button id="wxsys" type="primary" v-on:click="sys_click()">{{qsa}}</mt-button>
????</div>
js代碼
import wx from 'weixin-js-sdk'
export default {
? ? data(){
? ? ? ? return {
? ? ? ? ? ? qsa:'qwe'
? ? ? ? }
? ? },
methods : {
? ? sys_click : function()
? ? {
? ? ? ? this.qsa = 'qqq'
? ? ? ? this.$axios({
? ? ? ? method: 'post',
? ? ? ? url: 'xxxxxx',
? ? ? ? }).then((res)=>{
? ? ? ? ? ? // 認(rèn)證
? ? ? ? wx.config({
? ? ? ? ? ? debug: true, // 開啟調(diào)試模式,
? ? ? ? ? ? appId: res.appId, // 必填,企業(yè)號(hào)的唯一標(biāo)識(shí),此處填寫企業(yè)號(hào)corpid
? ? ? ? ? ? timestamp: res.timestamp, // 必填,生成簽名的時(shí)間戳
? ? ? ? ? ? nonceStr: res.nonceStr, // 必填,生成簽名的隨機(jī)串
? ? ? ? ? ? signature: res.signature,// 必填,簽名,見附錄1
? ? ? ? ? ? jsApiList: ['scanQRCode','checkJsApi'] // 必填,需要使用的JS接口列表,所有JS接口列表見附錄2
? ? ? ? });
? ? ? ? })
? ? // 錯(cuò)誤時(shí)
? ? wx.error(function (res) {
? ? ? ? alert("出錯(cuò)了:" + res.errMsg);//這個(gè)地方的好處就是wx.config配置錯(cuò)誤,會(huì)彈出窗口哪里錯(cuò)誤,然后根據(jù)微信文檔查詢即可。
? ? });
? ? // 成功時(shí)
? ? wx.ready(function () {
? ? ? ? wx.checkJsApi({
? ? ? ? ? ? jsApiList: ['scanQRCode'],
? ? ? ? ? ? success: function (res) {
? ? ? ? ? ? }
? ? ? ? });
? ? ? ? ? ? wx.scanQRCode({
? ? ? ? ? ? ? ? needResult: 1, // 默認(rèn)為0,掃描結(jié)果由微信處理,1則直接返回掃描結(jié)果,
? ? ? ? ? ? ? ? scanType: ["qrCode"], // 可以指定掃二維碼還是一維碼,默認(rèn)二者都有
? ? ? ? ? ? ? ? success: function (res) {
? ? ? ? ? ? ? ? ? ? var result = res.resultStr; // 當(dāng)needResult 為 1 時(shí),掃碼返回的結(jié)果
? ? ? ? ? ? ? ? ? ? alert("掃描結(jié)果:"+result);
? ? ? ? ? ? ? ? ? ? window.location.href = result;//因?yàn)槲疫@邊是掃描后有個(gè)鏈接,然后跳轉(zhuǎn)到該頁(yè)面
? ? ? ? ? ? ? ? }
? ? ? ? ? ? });
? ? });
? ? }
},
created(){
},
mounted(){
}
}