静态网站跳转小程序怎么做-vueH5跳转小程序

也想出现在这里？点击联系我~

立即下单

进入商城

进不了网站？换个网络试试！

官方链接：目录| 陌陌开文档总结：小程序跳转按钮：

用于在页面上提供一个可以跳转到指定小程序的按钮。 使用该标签后，用户需要点击网页中的标签按钮才能跳转到小程序。 H5通过开放标签打开小程序的场景值为1167。

为此功能打开对象：

经过认证的服务帐号，该服务帐号与“JS套接字安全域名”下的网页绑定静态网站跳转小程序怎么做，通过该标签可以跳转到任何合法合规的小程序。经过认证的非个人小程序，使用开发的静态网站通过小程序云在绑定的域名下托管网页静态网站跳转小程序怎么做，您可以通过该标签跳转到任何合法合规的小程序开始使用

1.目录结构

2.配置jJS_SDK

// 先安装 jweixin，1.6.0以上版本
npm install jweixin-module --save

// main.js
import jweixinModule from "jweixin-module"
Vue.prototype.$jweixinModule = jweixinModule;
// #ifdef H5  
import wechat from './common/wechat'
if (wechat.isWechat()) {
	Vue.prototype.$wechat = wechat;
}
// #endif

// wechat.js
var jweixin = require('jweixin-module');
export default {
	//初始化sdk配置  
	initJssdk: function(callback) {
		uni.request({
			url: '请求的url',
			data: {
				wx_url: window.location.href.split('#')[0]
			},
			success: res => {
				if (res.data) {
					jweixin.config({
						debug: false, // 开启调试模式
						appId: res.data.d.appId, // 必填，公众号的唯一标识
						timestamp: res.data.d.timestamp, // 必填，生成签名的时间戳
						nonceStr: res.data.d.nonceStr, // 必填，生成签名的随机串
						signature: res.data.d.signature, // 必填，签名
						jsApiList: [
							'checkJsApi',
							'updateAppMessageShareData', //朋友
							'updateTimelineShareData' //朋友圈
						] ,// 必填，需要使用的JS接口列表
						openTagList:[
							"wx-open-launch-weapp"
						] // 打开小程序
					});
					// 配置完成后，再执行分享等功能  
					// _this.hasInit = true;
					if (callback) {
						callback(res.data);
					}
				}
			}
		});
	}
}

3、页面添加按钮

// index.vue
// pages/index/index.html 请用自己的小程序路径代替

	
		去小程序 
	

除了使用按钮跳转之外，还可以使用图片跳转。

不过图片的风格比较难调试，绝对定位不生效！ ！ ！ 使用的图片必须是在线url，本地路径不生效。

样式可以写在样式标签组上方

		
			
				.pic1 {
					width: 202px;
                    height: 66px;
					margin-left: 4%;
				}