本文共 1476 字，大约阅读时间需要 4 分钟。

服务号订阅通知按钮：wx-open-subscribe

注意事项和参数说明等，这些直接看官网 

在vue 环境下，需要js 动态创建wx-open-subscribe 这个标签，不能按照官网的直接在页面里面写，

首选在页面你需要展示的地方写个dom元素

   
        这里是放订阅消息按钮的，标签id 会用到，通过找到这个元素，然后添加进来
   

然后就是js部分，在vue 的methods 方法里面写

// 创建订阅号    	createSubscribeBut(){    		let script = document.createElement('script')				script.type = 'text/wxtag-template' 				script.text = `
点击订阅
`// 创建订阅标签，把标签里面自定义的script标签内容插进去 				let html = `
   
    ${script.outerHTML}`				document.getElementById('share-success-sub-wrap').innerHTML = html;				var subBtn = document.getElementById('share-success-subscribe-btn');				this.watchSub(subBt);    	},// 监听订阅事件    	watchSub(subBtn){    		let templateIdArr = ['订阅消息的模板id','订阅消息的模板id'];    		let _this = this;    		subBtn.addEventListener('success', function (e) { 					let tps = [];                    // 这个订阅返回的参数不是正常的json 需要转					let subdetail = JSON.parse(e.detail.subscribeDetails);                    					if( subdetail[templateIdArr[0]].indexOf('accept') !=-1){						tps.push(templateIdArr[0])					}					if( subdetail[templateIdArr[1]].indexOf('accept') !=-1){						tps.push(templateIdArr[1])					}                    // 用户点击订阅消息，但是取消订阅，这个时候直接不走后面代码					if(!tps.length) return;                    // 用户订阅了，就把订阅的模块id用逗号拼接下，传给后端，我这边是这样处理的，你根据后端接口需求来处理					tps = tps.join();                        //  发送ajax 请求 XXXXX		            // 这里面可以写订阅成功的事件，把点击订阅得到的参数传给后台做记录								});       	},
   

 下面给个案例展示

结束：如有不了解的可以留言，相互学习。

 生活不易，下面是我自己的小程序，看到的麻烦扫码打开给个支持啊，订阅通知，后面有福利活动会通知奥

转载地址：http://kqsmf.baihongyu.com/