Vue应用中结合vux使用微信jssdk的方法_vue中使用sdk资源-CSDN文库

138 浏览量 2020-12-11 16:27:54 上传评论收藏 50KB PDF 举报

资源推荐

资源详情

资源评论

Vue 应用中结合应用中结合vux使用微信使用微信 jssdk的方法的方法

vux微信分享说明微信分享说明

分享接口只有认证公众号才能使用，域名必须备案且在微信后台设置。

先确认已经满足使用jssdk的要求再进行开发。

引入引入

在 main.js 中全局引入：

import { WechatPlugin } from 'vux'

Vue.use(WechatPlugin)

console.log(Vue.wechat) // 可以直接访问 wx 对象。

组件外使用组件外使用

考虑到你需要在引入插件后调用config方法进行配置，你可以通过 Vue.wechat 在组件外部访问wx对象。

jssdk需要请求签名配置接口，你可以直接使用 VUX 基于 Axios 封装的 AjaxPlugin

import { WechatPlugin, AjaxPlugin } from 'vux'

Vue.use(WechatPlugin)

Vue.use(AjaxPlugin)

Vue.http.get('/api', ({data}) => {

Vue.wechat.config(data.data)

})

组件中使用组件中使用

那么之后任何组件中都可以通过 this.$wechat 访问到 wx 对象。

export default {

created () {

this.$wechat.onMenuShareTimeline({

title: 'hello VUX'

})

}

}

我所使用的是组件外定义，组件内调用

引入对应的文件引入对应的文件

import Vue from 'vue'

import { WechatPlugin } from 'vux'

Vue.use(WechatPlugin)//使用微信插件

//微信分享

const wxShare = (obj,callback)=>{

// console.log(obj,callback);

function getUrl(){

var url = window.location.href;

var locationurl = url.split('#')[0];

//console.log(locationurl);

return locationurl;

}

if(obj){

var title = obj.title==undefined||obj.title==null?'泉水系统':obj.title;

var link = obj.link==undefined||obj.link==null?window.location.href:obj.link;

var desc = obj.desc==undefined||obj.desc==null?'泉水系统':obj.desc;

var imgUrl = obj.imgUrl==undefined||obj.imgUrl==null?'src/img/share.png':obj.imgUrl;

var debug = obj.debug==true?true:false;

}else{

alert('请传分享参数');

}

本内容试读结束，登录后可阅读更多

下载后可阅读完整内容，剩余2页未读，立即下载

内容反馈

weixin_38633157

粉丝: 5
资源: 968

最新资源

资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！点击此处反馈

feedback-tip