承接上篇博客。

通过点击按钮跳转到新的页面。

先创建新页面home:

代码如下:

// home.js
Page({}) // 注册页面 // home.json
{} // home.wxml
<text>home页面</text>

home页面创建好后,去app.json里面配置路径:

// app.json
{
"pages": [
"qrcode/index/index",
"qrcode/home/home"
]
}

接下来,去index.js里面写跳转的函数:

// index.js
Page({
but: function(){
console.log("你好");
this.setData( // 一定要调用this.setData方法
{}, // 注意这个要保留,原因以后再讲
function(){
wx.navigateTo({ // wx是全局的
"url": "/qrcode/home/home" // 跳转页面的路径
})
}
)
}
})

保存后,点击按钮,效果如下:

结束!

微信小程序开发(四)页面跳转的更多相关文章

  1. 微信小程序开发之页面跳转并携带参数

    接口: wx.navigateTo({url:......})   保留当前页面,跳转到应用内指定URL页面,导航栏左上角有返回按钮 wx.redirecTo({url:.....})       关 ...

  2. 【微信小程序开发】页面配置

    app下的app.json文件是全局配置. app下的每一个page中,也可以配置.json文件. page中配置的内容是对应app中window配置项下的内容. page中的配置将覆盖window中 ...

  3. 微信小程序开发 [02] 页面注册和基本组件

    1.页面注册 既然我们希望跳转到新的页面,那自然要新建页面相关的文件才行.在开篇已经讲过,一个小程序页面由四个文件组成,假如我们的页面名为welcome,那么这四个文件则是: welcome.js w ...

  4. 微信小程序插件内页面跳转和参数传递(转)

    在此以插件开发中文章列表跳传文章详情为例. 1.首先在插件中的文章列表页面wxml中绑定跳转事件. bindtap='url' data-id="{{item.article_id}}&qu ...

  5. 微信小程序插件内页面跳转和参数传递

    在此以插件开发中文章列表跳传文章详情为例. 1.首先在插件中的文章列表页面wxml中绑定跳转事件. bindtap='url' data-id="{{item.article_id}}&qu ...

  6. 微信小程序之----navigator页面跳转

    navigator navigator跳转页面样式分为两种一种是左上角带返回按钮跳转到新的页面,另一种不带即在本页跳转,通过控制redirect属性 .js <view> <navi ...

  7. 【微信小程序】Page页面跳转(路由/返回)并传参

    页面跳转的方法参考官方文档: https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/route.html 问题:使用wx.na ...

  8. 微信小程序开发之页面wxml里面实现循环 wx:for

    js代码: Page({ data:{ upploadimagelist:{},    //上报图片列表 js数组 }}) 后台数据库保存的格式:{"imageList":[{&q ...

  9. 微信小程序开发之页面注册

    页面Page是object Page({  data:{    String1  },  onLoad:function(options){    // 生命周期函数--监听页面加载 一个页面只会调用 ...

  10. 记账本微信小程序开发四

    学习添加组件 集成日期组件 添加组件 需要在main.js文件中,声明一个data值date与wxml中的{{date}}绑定关联,然后在onLoad中初始化字符串格式的日期值, 处理日期组件点击确认 ...

随机推荐

  1. MySQL数据库相关资料

    python 全栈开发,Day60(MySQL的前戏,数据库概述,MySQL安装和基本管理,初识MySQL语句) python 全栈开发,Day61(库的操作,表的操作,数据类型,数据类型(2),完整 ...

  2. HDU1003 最大连续子序列

    Max Sum Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Sub ...

  3. [BAT] SetX 永久设置环境变量

    SetX 有三种使用方式: 语法 1: SETX [/S system [/U [domain\]user [/P [password]]]] var value [/M] 语法 2: SETX [/ ...

  4. C/C++编程

    基本的数据类型: 整型 浮点型(单精度.双精度) 在c语言中,所有的变量声明必须在任何执行语句之前(对当前域来说), 否则编译的时候会出现变量是未声明的标识符的错误. main 入口参数:argc 和 ...

  5. 【DSP开发】德州仪器达芬奇五年之路七宗罪,嵌入式处理器架构之争决战2012

    芯片是产业链上游重要的一个环节,一颗小小的芯片具有极高的技术含量和价值,半导体行业每年都会有一个各大厂商营业额的排名,除去2009年,常年盘踞在前三名位置的分别是英特尔,三星半导体和德州仪器,英特尔凭 ...

  6. 第一个go程序

    进入到工作空间中(我的是$HOME/go, 所以使用cd $HOME/go命令直接进入) 然后创建一个目录 src/hello( mkdir src/hello), 然后进入到该目录中(cd src/ ...

  7. IDEA 启动项目 很慢,总会到某个点进行延迟卡顿。

    最开始的我解决的方式 clean 项目 忙完后,闲暇时间想起这个问题,然后进行 面向百度,发现了问题所在 参考文档:https://www.cnblogs.com/zhangzhonghui/p/11 ...

  8. Python非递归实现二叉树的后续遍历

    leetcode 145. Binary Tree Postorder Traversal 思路一: 使用一个栈stack保存经过的根结点,另一个栈flag保存每个结点的右子树是否遍历: 如果根结点存 ...

  9. 三分钟搞定Python中的装饰器

    python的装饰器是python的特色高级功能之一,言简意赅得说,其作用是在不改变其原有函数和类的定义的基础上,给他们增添新的功能. 装饰器存在的意义是什么呢?我们知道,在python中函数可以调用 ...

  10. 统计学习方法 | 感知机 | python实现

    感知机是二类分类的线性分类模型,利用随机梯度下降法对基于误分类的损失函数进行极小化. 书中算法可以将所有样本和系数向量写成增广向量的形式,并将所有负样本乘以-1,统一形式,方便计算. (1)训练数据集 ...