web-view内嵌web分享功能以及小程序跟web分离实现

1、在小程序中添加新的页面，进行跳转处理

html:

<web-view @message="onMessageReceive" src="{{newsUrl}}"></web-view>

js:
data = {
    newsUrl: '',  // 跳转的路径
    openId:'', // 跳转携带的参数
    agentId:'', // 跳转携带的参数
    shareUrl:'', // 跳转携带的参数
    token:'' // 跳转携带的参数
};

 在onLoad生命周期中对跳转的路径进行处理

let localUserInfo = wepy.getStorageSync('user_message');
if (typeof localUserInfo === 'object') {
} else if (typeof localUserInfo === 'string' && localUserInfo.length > 0) {
    localUserInfo = JSON.parse(localUserInfo);
}
this.openId = localUserInfo.openId;
this.agentId=this.userInfoStore.agentId;
this.token=wepy.getStorageSync('access_token');
if(this.openId&&this.agentId&&this.token){
    this.newsUrl = `http://event.itsmycar.cn/seller-lottery?                
      openId=${this.openId}&agentId=${this.agentId}&token=${this.token}`
}else if(this.openId&&this.agentId&&!this.token){
    this.newsUrl = `http://event.itsmycar.cn/seller-lottery?    
      openId=${this.openId}&agentId=${this.agentId}`
}else{
    this.newsUrl = `http://event.itsmycar.cn/seller-lottery`
}

以上是处理跳转的路径，在小程序中完成

2、外链跳转的地址是放在服务器的文件，由vue-cli3.0搭建，它需要安装依赖

npm install weixin-js-sdk --save

安装依赖是为了做分享处理，只能点击右上角的转发来进行触发，页面按钮button并不能触发分享

注意：从web端跳转到小程序需使用wx.miniProgram.navigateTo、wx.miniProgram.navigateBack、wx.miniProgram.switchTab、wx.miniProgram.reLaunch、wx.miniProgram.redirectTo进行跳转

1、引入
  import wx from "weixin-js-sdk";

2、使用跳转
    wx.miniProgram.postMessage({ data: "web_app" });
    wx.miniProgram.switchTab({
       url: `/pages/home/index`
    });

3、小程序中的分享回调
    onShareAppMessage正常使用就行

以上有缺点，转发只能触发右上角的menu出的转发，不能在页面中定义button触发转发（分享）