基于vue开发的在线付费课程应用过程

关键代码

let http = axios.create({
 baseURL: HOST + '/api/',
 timeout: 10000,
 headers: {
  'Accept': 'application/json',
  'Authorization': 'Bearer ' + TOKEN,
  'InUrl': INURL,//传第一次打开页面的链接
  'IsIos': isiOS//传是否ios
 }
})

后台要拿三个

$is_ios = request()->header('IsIos');//获取是否ios
$in_url = request()->header('InUrl');//获取第一次打开页面路径
$in_url = explode("#", $in_url)[0];//处理一下
if ($is_ios == 'true') {
  $url = $in_url;//ios用第一次打开页面路径签名
} else {
  $url = url()->previous();//安卓就用请求这个接口的路径去签名
}
//用url去签名吧

拿到签名后怎么初始化呢

this.$wechat.config(res.data.wx_config)

这是vux提供的

由于应用使用了页面缓存，所以在定义自定义分享数据的代码就要放在 activated 里面执行，具体实现

首先定义一个 init=false

mounted 开始请求数据拿到签名

this.$wechat.config(res.data.wx_config)
 this.$wechat.ready(() => {
  this.set_share()
 })

在 methods 定义一个方法

set_share () {
 // 自定义分享到朋友圈
 this.$wechat.onMenuShareTimeline({
  title: this.share.title,
  link: this.share.url,
  imgUrl: this.share.icon,
  success: () => {}
 })
 this.$wechat.onMenuShareAppMessage({
  title: this.share.title,
  desc: this.share.desc,
  link: this.share.url,
  imgUrl: this.share.icon
 })
}

activated 定义

activated () {
 this.set_share()
}

keep-alive 组件激活时重新设置一下自定义分享的数据，要不然如果在返回前的页面也定于的自定义分享，返回后页面没有刷新，分享的数据就会是之前的，这里重新定义一下就可以了。

总结

以上所述是小编给大家介绍的基于vue开发的在线付费课程应用过程，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支持！