微信小程序之跳转、请求、带参数请求小例子
wx.request(OBJECT)
wx.request发起的是 HTTPS 请求。一个微信小程序,同时只能有5个网络请求连接。
具体参数说明参看微信小程序官方文档-发起请求。
例:
//当页面加载时,请求后台数据,并赋值给前台显示
Page({
data:{
new_list:[]
},
onLoad:function(){
var that = this;
wx.request({
url:'http://wxcms.com/getList',
header:{
'content-type':'application/json',
},
success:function(res)
{
//将请求的后台数据赋值new_list
that.setData({
new_list:res.data,
})
}
})
}
})
wx.navigateTo(OBJECT)
保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。
具体参数说明参看微信小程序官方文档-跳转
例:
wxml代码:
<view class="lists">
<view class="img">
<!---这里绑定了一个手指触摸后马上离开的时间,跳转时并带上了id参数-->
<image src="{{img}}" bindtap="detial" data-id="{{id}}"></image>
</view>
<view class="info">
<view class="title">{{title}}</view>
<view class="time">{{time}}</view>
</view>
</view>
js代码:
Page({
data:{
new_list:[]
},
detial:function(event){
//带id跳转到指定的页面,这里的event.currentTarget.dataset.id是获取wxml页面上的data-id参数,详见事件说明
wx.navigateTo({
url:"../../pages/detail/detail?id="+event.currentTarget.dataset.id
})
}
})
带参数的wx.request(OBJECT)
上述代码跳转到指定页面后:
Page({
data:{
info:{}
},
//res对象包含了跳转页面中的id参数,再页面加载时,获取id参数然后向后台请求参数,并赋值
onLoad:function(res)
{
var that = this;
wx.request({
url:"http://wxcms.com/getOne",
//这里是传参res.id就是跳转url(?id=xxxx)的参数值 xxxx
data:{
id:res.id,
},
header:{
'content-type':'application/json'
},
success:function(msg)
{
that.setData({
info:msg.data,
})
}
})
}
})
微信小程序之跳转、请求、带参数请求小例子的更多相关文章
- 微信小程序页面跳转,带参数跳转
1. wx.navigateTo (保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面.) 路径:只能跳转非tabbar路径 参数: 'path?key=v ...
- App拉起小程序提示跳转失败
App拉起小程序提示跳转失败 req.userName = "gh_8afldfalsejw"; // 小程序的原始ID,注意不是Appid
- 微信小程序 路由跳转 异步请求 存储数据,微信登录接口
1小程序路由跳转 wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 tabBar l ...
- 微信小程序——页面跳转及传参
小程序页面跳转 微信小程序的页面跳转依然是以传统的请求转发和请求重定向为主,tabbar的存在,有TAB页面的跳转. 为了微信小程序的简介方便,规定页面路径只能是十层,应尽量避免过多的交互方式. 1. ...
- 用python一步一步教你玩微信小程序【跳一跳】
12月28日,微信上线了小游戏「跳一跳」,瞬间成了全民游戏,如何牢牢占据排行榜的第一位呢?用Python帮助你,Python真的无所不能. 作为技术出身的我们,是不是想用技术改变排名呢? 注意:本文适 ...
- 微信小程序路由跳转
微信小程序路由跳转 1.wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面, 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 参数 O ...
- 微信小程序页面跳转方法总结
微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面.// 注 ...
- 微信小程序如何跳转到另一个小程序
微信小程序如何跳转到另一个小程序,要注意:在app.json文件里也要配置 navigateToMiniProgramAppIdList,如下图: "navigateToMiniProgra ...
- 解决微信小程序用 SpringMVC 处理http post时请求报415错误
解决微信小程序用 SpringMVC 处理http post时请求返回415错误 写微信小程序时遇到的问题,这个坑硬是让我整了半天 wx.request请求跟ajax类似处理方法一致 小程序端请求代码 ...
- 利用python实现微信小程序游戏跳一跳详细教程
利用python实现微信小程序游戏跳一跳详细教程 1 先安装python 然后再安装pip <a href="http://newmiracle.cn/wp-content/uploa ...
随机推荐
- spring cloud config svn仓库配置
之前快速入门了一下spring cloud config 但是仓库用的别人博客上的git仓库,公司用的是svn项目管理中心,下面这个自己配置的时候出现的错误 You need to configure ...
- webpack实践笔记
1)cross-env 能跨平台地设置及使用环境变量 大多数情况下,在windows平台下使用类似于: NODE_ENV=production的命令行指令会卡住,windows平台与POSIX在使用命 ...
- Vue的自定义组件之间的数据传递
一,父级传向子级 1,在子级的属性中添加props:['myname',......],参数可以传多个,看具体而定: 2,在父级data中定义好需要传递的变量数据,例如name:"rose& ...
- ES6中var/let/const的区别
let的含义及let与var的区别: let 声明的变量只在它所在的代码块有效: 如下: for (let i = 0; i < 10; i++) { console.log(i); } con ...
- maven的依赖特性
若排版紊乱可查看我的个人博客原文地址 maven的依赖特性很多很杂,这里大概总结一下,maven的依赖特性主要是依赖范围和传递依赖,前者会影响后者,这篇文章会介绍传递依赖的传递原则,出现冲突传递依赖默 ...
- elasticsearch5.0以上版本及head插件的安装
本文转载至:https://www.cnblogs.com/hts-technology/p/8477258.html(针对5.0以上版本) 对于es5.0以下的版本可以参考:https://www. ...
- java项目 在 linux ubuntu 上的部署相关
--------------------JDK在linux ubuntu上的安装------------------------------------------------------------ ...
- python笔记18-高阶函数
高阶函数: 如果一个函数的入参是一个函数名的话,那这个函数就是一个高阶函数 函数即变量 # def hello(name):# print(name)# new_hello = hello#hello ...
- Map集合练习题
(Map)已知某学校的教学课程内容安排如下: 完成下列要求:1) 使用一个Map,以老师的名字作为键,以老师教授的课程名作为值,表示上述课程安排.2) 增加了一位新老师Allen 教JDBC3) Lu ...
- UDP聊天工具的实现
利用TIdUDPClient; TIdUDPServer; 实现聊天,其实很不爽,没有解决中文乱码问题,以后补充吧! 代码如下: unit Unit1; interface uses ...