微信小程序调用后台接口+热点新闻滚动展示
1、微信JS文件,发送请求调用: //将返回接口数据,写入Page({data})里面
//获取热点新闻,这个也是写在onload:function(){//code)里面的
wx.request({
url: 'https://m.xxiangfang.com/index.php/Home/Xiaoxxf/activity?is_hot=1',//热点新闻
data: {},
method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
header: {
'Content-Type': 'application/json'
},
success: function (res) {
console.log(res.data)
that.setData({
notices: res.data //一维数组,只取两条数据
})
},
fail: function () {
// fail
},
complete: function () {
// complete
}
})
2、后台php处理:
使用curl调用即可,记得传参和token(key)标识
3、JS文件里面【热点新闻滚动展示】:
onLoad: function (res) {
startNotice: function() {
var me = this;
var notices = me.data.notices || [];
//console.log(this.data.notices) //就是这里有问题,数据还没从接口返回就跑到这里了 xzz-6.2
if( notices.length == 0 ) {
//return; //是这里的问题,数据没加载过来,导致程序return;
} var animation = me.animation;
//animation.translateY( -12 ).opacity( 0 ).step();
// animation.translateY( 0 ).opacity( 1 ).step( { duration: 0 });
// me.setData( { animationNotice: animation.export() }); var noticeIdx = me.data.noticeIdx + 1;
console.log(notices.length);
if( noticeIdx == notices.length ) {
noticeIdx = 0;
} // 更换数据
setTimeout( function() {
me.setData( {
noticeIdx: noticeIdx
});
}, 400 ); // 启动下一次动画
setTimeout( function() {
me.startNotice();
}, 5000 );
}, onShow: function() {
this.startNotice();
},
4、wxml的前段代码:
<span style="color:#999999">热门活动</span><span style="color:#3273c3">{{notices[noticeIdx]}}</span>
微信小程序调用后台接口+热点新闻滚动展示的更多相关文章
- java微信小程序调用支付接口(转)
简介:微信小程序支付这里的坑还是有的,所以提醒各位在编写的一定要注意!!! 1.首先呢,你需要准备openid,appid,还有申请微信支付后要设置一个32位的密钥,需要先生成一个sign,得到pre ...
- java微信小程序调用支付接口
简介:微信小程序支付这里的坑还是有的,所以提醒各位在编写的一定要注意!!! 1.首先呢,你需要准备openid,appid,还有申请微信支付后要设置一个32位的密钥,需要先生成一个sign,得到pre ...
- 微信小程序调用api接口
请求的第三方微信url大概有3种 1)$url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=$appid&s ...
- 微信小程序 调用远程接口,给全局数组赋值
关键是 let that = this 因为在onLoad 的 wx.request方法里, this指的是 wx.request 的上下文, 所以应该是在 onLoad 的时候定义 let that ...
- 微信小程序通过api接口将json数据展现到小程序示例
这篇文章主要介绍了微信小程序通过api接口将json数据展现到小程序示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧实现知乎客户端的一个重要知识前提就是,要知道怎么通过 ...
- 微信小程序结合后台数据管理实现商品数据的动态展示、维护
微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,本篇随笔介绍微信小程序结合后台数据管理实现商品数据的动态展示.维护,介绍如何实现商品数据在后台管理系统中的维护管理,并通 ...
- 图解微信小程序---调用API操作步骤
图解微信小程序---调用API操作步骤 什么是API API(Application Programming Interface,应用程序编程接口:是一些预先定义的函数,目的是提供应用程序与开发人员基 ...
- 微信小程序request(ajax)接口请求封装
微信小程序request(ajax)接口请求封装 最近在进行小程序的编写,需要调用后端接口,经常要用到wx.request方法,所以就自己封装了一下,简化一下代码,如果能给大家提供帮助更好,在封装的时 ...
- 微信小程序+java后台
博主是大四学生,毕业设计做的是微信小程序+java后台.陆陆续续经历了三个月(因为白天要实习又碰上过年玩了一阵子),从对微信小程序一无所知到完成毕设,碰到许多问题,在跟大家分享一下自己的经历和一个小程 ...
随机推荐
- Cocos2d-x
http://blog.csdn.net/ccf19881030/article/details/9204801 Cocos2d-x相关的博客以及官网信息 1.CSDN博主无幻的博客:http://b ...
- Glusterfs初试
Gluster的模式及介绍在此不表,这里只记录安装及配置过程. 1.整体环境 server1 : gfs1.cluster.com server2 : gfs2.cluster.com Client: ...
- 数据库实例: STOREBOOK > 用户 > 编辑 用户: MGMT_VIEW
ylbtech-Oracle:数据库实例: STOREBOOK > 用户 > 编辑 用户: MGMT_VIEW 编辑 用户: MGMT_VIEW 1. 一般信息返回顶部 1.1, ...
- russian-doll-envelopes
https://leetcode.com/problems/russian-doll-envelopes/ // Use map (Russian doll number -> vector o ...
- 附4 springboot源码解析-run()
public ConfigurableApplicationContext run(String... args) { StopWatch stopWatch = new StopWatch(); / ...
- DotNetBar中dotNetBarManager设置窗口 实现单文档视图界面
本人想设计一个但文档视图的界面: |--------------------------------------------------------------- | Ribbon Bar |-- ...
- VMware vCenter中, 如何辩认虚机上Raw Device Mapping过了的一块物理磁盘?
比如说, 我们有一套VMware的环境, 其中有一台运行者ESXi的主机, 其上有十块SAS盘. 这十块盘中的五块盘被RDM到一台虚机上了. 假设你发现有添加多了一块盘, 你想移除掉, 但是5块盘其中 ...
- 升级iOS10后http网页定位失效解决方案
最近我们在做项目时遇到这样一个新问题,用户在升级 iOS10 后,在 http 下使用 geolocation api 会报错,控制台输出 [blocked] Access to geolocatio ...
- 【架构】SpringCloud JHipster -微服务相关资料
SpringCloud-微服务相关资料 基于Spring Boot和Spring Cloud实现微服务架构学习(四)-Spring Cloud总结 - zeb_perfect的专栏 - 博客频道 - ...
- Android6.0执行时权限解析,RxPermissions的使用,自己封装一套权限框架
Android6.0执行时权限解析,RxPermissions的使用.自己封装一套权限框架 在Android6.0中,新添加了一个执行时的权限,我相信非常多人都已经知道了.预计也知道怎么用了,这篇博客 ...