如何进行微信小程序的页面跳转-创新互联

本篇文章为大家展示了如何进行微信小程序的页面跳转，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。

为秦安等地区用户提供了全套网页设计制作服务，及秦安网站建设行业解决方案。主营业务为成都做网站、网站设计、秦安网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！

我们将创建第二个视图，然后实现从第一个视图到第二个视图的跳转。

首先开发第二个视图：

微信小程序开发系列七：微信小程序的页面跳转

{{index + 1}}. {{log}}

做过Angular开发的朋友们对上面的视图设计一定不会陌生。这个视图的数据源由模型logs提供，是一个列表结果，列表每个元素的数据源是模型logs里的一条记录，用log代表。

为了让log看起来显示更整齐，在log内容之前，显示每条log的索引。因为log的索引从0开始，所以用{{index + 1}}在索引前加一，这样显示的索引更符合普通人的阅读习惯。

这个视图的控制器：

//logs.jsconst util = require('../../utils/util.js')
Page({   data: {        logs: []
   },   onLoad: function () {       this.setData({            logs: (wx.getStorageSync('logs') || []).map(log => {                  return util.formatTime(new Date(log))
            })
       })
   }
})

控制器logs.js的实现：

我们可以回忆这个系列里第四篇文章介绍过控制器的实现逻辑：

微信小程序开发系列四：微信小程序之控制器的初始化逻辑

在控制器里调用Page构造函数，给当前控制器指定名为logs的数据模型。

这个数据模型的值填充，通过微信框架提供的API wx.getStorageSync来获取。

wx.getStorageSync的含义在微信小程序官网上有定义：从本地缓存中同步获取指定 key 对应的内容。

https://developers.weixin.qq.com/miniprogram/dev/api/data.html#wxgetstoragesynckey

第二个视图的UI和控制器都开发完毕，剩下的事情就是在第一个视图里定义一个触发点，让它能触发到第二个视图的跳转。

我在第一个视图上通过属性bindtap绑定了一个点击函数bindViewTap:

bindViewTap在第一个控制器index.js里的实现：

bindViewTap: function() {
   wx.navigateTo({         url: '../logs/logs'
    })
},

跳转还是通过微信小程序提供的API wx.navigateTo:

保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面。

上述内容就是如何进行微信小程序的页面跳转，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注创新互联-成都网站建设公司行业资讯频道。

网站标题：如何进行微信小程序的页面跳转-创新互联
文章起源：http://6mz.cn/article/coijdh.html