微信小程序之跳转、请求、带参数请求小例子
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 ...
随机推荐
- 关于ajax的跨域
在前端开发中,跨域是经常遇到的问题,也是面试最喜欢问的问题,究其根本原因,是浏览器的同源策略所致,是浏览器为了避免不同域名不能共享cookie以及locationstorage等等,发起请求的时候无法 ...
- ThinkPHP部署在lnmp环境中碰到的问题
先说一下问题: 因为tp5的入口文件在public目录下,而Application和public同级, 我用的lnmp1.5默认做了防跨站目录设置,所以导致入口文件无法进入application目录, ...
- mybatis一简单one2one关系xml配置
user类 <?xml version="1.0" encoding="UTF-8"?><!DOCTYPE mapper PUBLIC &qu ...
- LCT模板(无讲解)
怎么说呢,照着打一遍就自然理解了,再打一遍就会背了,再打一遍就会推了. // luogu-judger-enable-o2 #include<bits/stdc++.h> using na ...
- Forth-83 多任务解析
body, table{font-family: 微软雅黑; font-size: 13.5pt} table{border-collapse: collapse; border: solid gra ...
- Failed to start bean 'stompBrokerRelayMessageHandler'; nested exception is java.lang.NoClassDefFoundError: reactor/io/codec/Codec
最新版本的Spring需要reactor 2.0,看看你的POM有一个明确的1.1.6依赖. 解决: <dependency> <groupId>org.projectreac ...
- webpack - minipack 打包原理
code:https://github.com/ronami/minipack 看了https://www.youtube.com/watch?v=Gc9-7PBqOC8总结一下 工具和环境: nod ...
- 请解释ASP.NET 中的web 页面与其隐藏类之间的关系?
一个ASP.NET 页面一般都对应一个隐藏类,一般都在ASP.NET 页面的声明中指定了隐藏类例如一个页面 Tst1.aspx 的页面声明如下 <%@ Page language="c ...
- js优化总结
避免全局查找 在一个函数中会用到全局对象存储为局部变量来减少全局查找,因为访问局部变量的速度要比访问全局变量的速度更快些 function search() { //当我要使用当前页面地址和主机 ...
- 基于springboot构建dubbo的入门demo
之前记录了构建dubbo入门demo所需的环境以及基于普通maven项目构建dubbo的入门案例,今天记录在这些的基础上基于springboot来构建dubbo的入门demo:众所周知,springb ...