微信小程序，模板+按钮+绑定事件

微信小程序，模板+按钮+绑定事件+页面跳转

文章类型：微信小程序
文章内容：使用模板定义按钮，使用循环创建按钮，并给按钮绑定事件，实现页面跳转。
注释很多，应该可以看得懂。
请指教，谢谢

.wxml模板内容，这里包含了一个按钮，还有一个文本

<template name="daoHangPage">
<button bindtap="{{fun}}" data-gobalpage="{{p}}">{{info}} </button><text>{{descript}}</text>
</template>
<!-- 参数fun的作用是为了接收实现类的参数，这个参数用于绑定点击响应事件。
参数p的作用是为了接收实现类遍历时个元素的值，这里是个元素中的页面路径属性，它将在goPage中被使用，会实现页面跳转。
info与descript的作用则只是为了传入值用来显示文本 -->

实现类的.wxml内容

<import src="../template/daoHangTempNo1/naviMain"></import>
<text>pages/导航主页/</text>
<template is="daoHangPage" wx:for="{{test}}"  data="{{info:item.info,descript:item.descript,fun:'goPage2',p:item.page}}"></template>
<!-- is的作用是使用模板，‘wx:for{{test}}’的作用是：根据集合test遍历执行，test集合定义在.js文件中。data="{{.....}}"的作用是给模板传入参数。 -->

实现模板的.js内容

Page({

  /**
   * 页面的初始数据
   */
  data: {    
  	//test数组，每个数组具有page、info、descript属性
    // page属性各元素本应不一致，但我的页面很少，便设为一样的，用来测试是否可用，你可以按照自己的需求更改路径
    // page属性被赋给模板的data-gobalpage形参，然后被goPage使用，实现页面跳转。
    // info是按钮文本，descript是显示文本
      test:[
        {
          page:"../newPage/newPage",
          info:"第一次实验页面",
          descript:"从开学开始的第一个页面"
        },
        {
          page:"../newPage/newPage",
          info:"第二次实验页面",
          descript:"从xxx开始的第二个页面"
        }
      ]
  },
   // 函数通过event参数调用gobalpage参数实现页面跳转。
  // 值得注意的是，对于不同页面有不同的跳转方式，不只是“ wx.redirectTo”。
  goPage2:function(event){
    console.log(event),
    wx.redirectTo({      
      url:event.currentTarget.dataset.gobalpage,   //要跳转到的页面路径
 	 })  
  },
})

OK，就这么多了，关于模板的美化样式，或者实现模板类的美化只要按照自己的需求添加样式就可以了。注意如果要使用模板的样式，要在实现类的wxss中导入模板的wxss文件。

关于这个东西我试了好长时间，我太笨了。
说一下猜想：

在按钮渲染时就必须要绑定监听事件，所以事件的绑定要在模板类中做，但因为需要参数，所以必须在模板类中定义一个形参，用来接收参数。值得一提的是，虽然事件的绑定在模板类中做，但事件方法却不在模板的js文件中，而是在实现类的.js文件中，可见，按钮实际上绑定的只是一个名字，在执行时才根据名字以及按钮各信息去找函数，