微信小程序错误处理记录

按钮无法点击 Do not have xxx handler in current page

在写一个小程序的demo，发现当点击一个按钮去跳转到其他页面的时候，发现出现上面的提示问题，检查是否在要跳转的页面的wxml里面注册了事件bindtap="事件名"，是否跳转的页面在app.json里面注册（注意页面之间的前后顺序），页面的js文件是否使用了Page({ 函数 })包裹。

跳转页面出错 Fail url xxx is not in app.json

跳转页面出错

出先这个问题，得注意检查一下url路径是否正确，有无空格之类的，微信的IDE不会报错，但是运行的时候，当路径由于粗心多空格就会出现这个问题

json文件解析错误

json文件解析错误
就算页面中的json页面不需要配置什么东西，但是还是需要写上一个{ }大括号，否者就会出现上图这个问题。

启动页面的顺序

要想那个页面为小程序打开的第一个页面，就在app.json 里面配置成第一个页面：

 "pages": [
    "pages/welcom/welcom",
    "pages/posts/post"
  ]

其余页面就通过事件绑定在之间切换：

// 在welcom页面的js文件中跳转到post页面
wx.navigateTo({
    url: '../posts/post',
  })

wx.navigateTo()是把跳转到的页面当作当前页面的一个子页面，wx.redirectTo()两个页面之间的平行跳转，没有父子关系

数据绑定

  onLoad: function (options) {
    var post_contant = { date: 'sep 18 2017', title: 'hello icessun', post_img: '/images/post/crab.png', duthor_img: '/images/1.png', content:'人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；',view_num:'112',collect_num:'96'};
    this.setData(post_contant);
  }

this.setData(接收一个对象)把数据源绑定到页面的Page({ data:数据源})中，作为data属性的一个值

循环数据绑定

// js当中
  onLoad: function (options) {
    var post_contant = [
      { date: 'sep 18 2017', title: 'hello icessun', post_img: '/images/post/crab.png', duthor_img: '/images/1.png', content: '人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；', view_num: '112', collect_num: '96' },
      { date: 'sep 18 2018', title: 'hello icessun', post_img: '/images/post/cat.png', duthor_img: '/images/1.png', content: '人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；人生就向一盒巧克力，你永远不知道下一刻拿起的是什么味道的巧克力；', view_num: '112', collect_num: '96' }
    ];
    this.setData({post_contant});
  }

// wxml当中
  <block wx:for='{{post_contant}}'>
    <view class='post-container'>
      <view class='post-author-date'>
        <image class='post-author' src='/images/1.png'></image>
        <text class='post-date'>{{item.date}}</text>
      </view>
      <text class='post-title'>{{item.title}}</text>
      <image class='post-image' src='{{item.post_img}}'></image>
      <text class='post-content'>{{item.content}}</text>
      <view class='post-like'>
        <image class='post-like-image' src='../../images/icon/chat.png'></image>
        <text class='post-like-date'>92</text>
        <image class='post-like-image' src='../../images/icon/view.png'></image>
        <text class='post-like-date'>65</text>
      </view>
    </view>
  </block>

使用block标签包裹要循环的标签，给其加上一个数据源属性wx:for='{{数据源}}'，默认是使用item来表示当前遍历的子元素，数据源有多少个数据，就会重复多少次。

在onLoad方法里面，使用this.setData()方法来绑定数据到Page结构体中的data属性里面，从而实现了数据绑定

注意标签的闭合性

有时候一些莫名其妙的错误，可能是标签没有闭合导致的，所以不得不注意一下

<import src='post-template/post-template.wxml'/>
// 忘记在后面加上  / 
<import src='post-template/post-template.wxml'>

就出现这个错误：

标签闭合

Template模版的使用

在你需要使用模版的页面下面，新建模版文件，把所有的模版

新建页面一定要注册

在app.json注册
新建的页面一定要在app.json页面里面注册，并且要是在新建的页面里面加上了json文件，那么一定不能让json文件是空白的，否者报错。js脚本文件也不能空着，一定要加上Page({ }) 这个方法