L002.微信小程序的各个页面是如何做链接的?

上面L001.我们创建了一个页面list,那么我们如何把新做的页面跟首页index做链接呢?

*我们先来看看logs日志页面是如何跟首页做的链接:

-- 我们点击首页的头像,会跳转到日志页面,那么机智的我们,打开index页面下面的index.wxml文件,会发现

-- 那么是如何做的跳转呢?

我们打开index页面下的index.js发现了

//事件处理函数
  bindViewTap: function() {
    wx.navigateTo({
      url: '../logs/logs'
    })
  },

这下我们明白了,原来是写了个用事件标识,写了个方法,调用小程序的接口做的跳转。

好吧,我们用同样的简单粗暴的方法,复制。

inxex.wxml 添加如下代码

<view bindtap="bindViewList" class="page-list">
    <text class="user-motto">List页面</text>
  </view>

index.js里添加如下

bindViewList: function() {
    wx.navigateTo({
      url: '../list/list'
    })
  },

index.wxss里添加如下

.page-list{
  margin-top:50px;
}

把list页面下的list.json代码做一下调整,这个是配置页面名称的,为了方便识别

{
    "navigationBarTitleText": "List列表页面"
}

OK,如果一切顺利,我们就把首页和List页面做好了链接了,试试看吧,goodlucky!