微信小程序开发(四)页面跳转
承接上篇博客。
通过点击按钮跳转到新的页面。
先创建新页面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" // 跳转页面的路径
})
}
)
}
})
保存后,点击按钮,效果如下:


结束!
微信小程序开发(四)页面跳转的更多相关文章
- 微信小程序开发之页面跳转并携带参数
接口: wx.navigateTo({url:......}) 保留当前页面,跳转到应用内指定URL页面,导航栏左上角有返回按钮 wx.redirecTo({url:.....}) 关 ...
- 【微信小程序开发】页面配置
app下的app.json文件是全局配置. app下的每一个page中,也可以配置.json文件. page中配置的内容是对应app中window配置项下的内容. page中的配置将覆盖window中 ...
- 微信小程序开发 [02] 页面注册和基本组件
1.页面注册 既然我们希望跳转到新的页面,那自然要新建页面相关的文件才行.在开篇已经讲过,一个小程序页面由四个文件组成,假如我们的页面名为welcome,那么这四个文件则是: welcome.js w ...
- 微信小程序插件内页面跳转和参数传递(转)
在此以插件开发中文章列表跳传文章详情为例. 1.首先在插件中的文章列表页面wxml中绑定跳转事件. bindtap='url' data-id="{{item.article_id}}&qu ...
- 微信小程序插件内页面跳转和参数传递
在此以插件开发中文章列表跳传文章详情为例. 1.首先在插件中的文章列表页面wxml中绑定跳转事件. bindtap='url' data-id="{{item.article_id}}&qu ...
- 微信小程序之----navigator页面跳转
navigator navigator跳转页面样式分为两种一种是左上角带返回按钮跳转到新的页面,另一种不带即在本页跳转,通过控制redirect属性 .js <view> <navi ...
- 【微信小程序】Page页面跳转(路由/返回)并传参
页面跳转的方法参考官方文档: https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/route.html 问题:使用wx.na ...
- 微信小程序开发之页面wxml里面实现循环 wx:for
js代码: Page({ data:{ upploadimagelist:{}, //上报图片列表 js数组 }}) 后台数据库保存的格式:{"imageList":[{&q ...
- 微信小程序开发之页面注册
页面Page是object Page({ data:{ String1 }, onLoad:function(options){ // 生命周期函数--监听页面加载 一个页面只会调用 ...
- 记账本微信小程序开发四
学习添加组件 集成日期组件 添加组件 需要在main.js文件中,声明一个data值date与wxml中的{{date}}绑定关联,然后在onLoad中初始化字符串格式的日期值, 处理日期组件点击确认 ...
随机推荐
- windows是下安装nvmw
nvmw:Windows环境下的node多版本管理工具. 安装: 1. git clone https://github.com/hakobera/nvmw.git 2.修改环境变量 计算机 -&g ...
- Python获取 东方财富 7x24小时全球快讯
本文使用的IDE为PyCharm. 1.第三方库 (1)selenium selenium用来做浏览器自动化,因为这部分信息是动态加载的,不用这种方法读取不到相关数据. 安装: pip3 instal ...
- 简单深入Joomla!3.1.5模块_组件开发(一)
简单深入Joomla!3.1.5模块_组件开发 主要内容: 1, 模块(访问数据库,链接到组件,数据基本流向) 2, 组件CRUD(MVC模式,访问数据库,表单提交,AJAX提交,数据基本流向) 3, ...
- Guava源码阅读-base-Charsets
package com.google.common.base; 今天在找base包下的源码阅读时,看到了Charsets,肯定是定义字符集的类,本来就想简单的看一下.(部分内容摘抄自:http://b ...
- POJ 3229:The Best Travel Design
Description Dou Nai ), and the end of the travel route hours on traveling every day. Input There are ...
- Spring Boot CommandLineRunner的使用
1. 说明 程序在启动完成的时候需要去处理某些业务,因此Spring Boot程序中需要去实现CommandLineRunner接口. 2. CommandLineRunner方法执行顺序 程序启动后 ...
- Redis 数据结构 & 原理 & 持久化
一 概述 redis是一种高级的key-value数据库,它跟memcached类似,不过数据可以持久化,而且支持的数据类型也很丰富. Redis支持五种数据类型:string(字符串),hash(哈 ...
- 关于JS原型以及原型链、instanceof的一些理解
一.JS原型 首先要区分两个概念 1.构造函数 2.实例:由构造函数通过new方式创建出来的就是实例 <script> function Foo() { } var f = new Foo ...
- python学习-9 pycharm的安装
1.python 开发IDE : pycharm.eclipse等等 安装: 百度搜索pycharm 就可以了,去官网下载专业版.(百度有各种破解方法) #不要 ...
- python — lambda表达式与内置函数
目录 1 lambda表达式 (匿名函数) 2 内置函数 1 lambda表达式 (匿名函数) 用于表示简单的函数 lambda表达式,为了解决简单函数的情况: def func(a1,a2): == ...