我需要实现的功能:小程序在一开始进入的时候,不获取手机号,在用户进行一些如点赞,评论,回复这些操作的时候,再弹出手机号获取页面。因为有非常多的页面都需要获取,且获取手机号传给后台的js有三大段,每个页面写的话,修改起来太费劲,就用了模板,但是发现模板里只能带参数和html,js带不过去,所以 往下看
1.首先,建立模板文件夹,注意!!!文件夹必须和utils文件夹同级,如果你放在page里,后面实现功能后,微信开发者里运行正确,但是真机报错,且不知道报的什么错,反正我排查了很久发现的,如有不对,欢迎指正。
/template/index.wxml:
<template name="mode">
<view class="index_mask" hidden='{{hasUserNum}}' catchtouchmove="move">
<view class="index_mask_box">
<navigator open-type='exit' target='miniProgram'>
<image src="/images/index/close.png"></image>
</navigator>
<view class="text">获取手机号</view>
<view>
<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" class="mask_btn">确定</button>
</view>
</view>
</view>
</template>
/template/index.wxss:
。。。
/template/index.js:
function init(){
var that = this ;
//这里是你要带的data里的数据
that.setData({
logo: '../../img/logo.png',
a:""
}) ;
//这里是对应你html里的点击事件啊下拉事件等等
that.getPhoneNumber = function(event){
} ;
。。。。
} ;
module.exports = {
init: init
} ;
需要引入的页面:
index.wxml
<import src="../../template/index.wxml" />
//hasUserNum 参数 因为我模板里这个参数是用来显示和隐藏的 没有这步的话直接在模板data里就行了
<template is="mode" data="{{hasUserNum}}" />
index.wxss
@import '../../template/index.wxss';
index.js
var header = require('../../../template/index');
page({
onLoad: function(options) {
//这里就是把模板里的js引入了
header.init.apply(this, [])
},
})