分享下自己写的一个微信小程序请求远程数据加载到页面的代码
1 思路整理
就是页面加载完毕的时候 请求远程接口,然后把数据赋值给页面的变量 ,然后列表循环
2 js相关代码 我是改的 onload函数
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var that = this;//这里注意,要不然setData不可用
wx.request({
url: 'http://****/index.php/Home/Wechat/index', // 仅为示例,并非真实的接口地址 header: {
'content-type': 'application/json' // 默认值
},
success(res) {
console.log(res.data) that.setData({
datalist: res.data,
})
}
})
},
3 模板页面直接循环即可
<view wx:for="{{datalist}}" class="scroll-view-item-01">
<view class="item_01" bindtap="bindViewDetailTap">
{{item.title}}
</view>
<view class="item_02">
{{item.time}}
</view>
</view>
分享下自己写的一个微信小程序请求远程数据加载到页面的代码的更多相关文章
- 微信小程序web-view之动态加载html页面
官方推出的web-view方便了很多开发人员. 我们在做的时候,经常会想到写一个小程序的page然后通过动态加载web-view的形式来完成其他功能页面的开发. 之前研究web-view的时候发现网上 ...
- 微信小程序开发动感十足的加载动画--都在这里!
代码地址如下:http://www.demodashi.com/demo/14242.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...
- 微信小程序开发——模板中加载html代码
最新方法可以使用微信小程序提供的 rich-text (富文本)组件直接写解析html,详见 rich-text: <rich-text class='f13 c_9' nodes=" ...
- 微信小程序的图片懒加载
在普通的web页面当中,我们都知道图片懒加载可以提升浏览器的加载速度.原理是图片用空或者占位图片进行显示,当屏幕移动到图片位置的时候,再把图片的地址换成它的地址.那么,在小程序当中呢,最近老大让看一下 ...
- 微信小程序实现滚动分页加载更多
参考网址:https://www.cnblogs.com/Smiled/p/8203306.html 1.wxml: <view class='myScroll' style='float:le ...
- 在应用中显示的图片很多情况不满足业务需求,我们需要动态根据图片的宽高进行缩放或加载中显示的缺省图片,这是我没就需要监听图片加载完成回调,来看看微信小程序怎么实现图片加载完成回调。
<swiper-item> <image src="{{item.image}}" class="slide-image" mode=&quo ...
- 如何快速地开发一个微信小程序
如何快速地开发一个微信小程序呢?我觉得作为初学者,最好能有一个模板,然后改这个模板. 同样作为初学者,刚开始的时候我有下面的几个问题,后来通过问同学,我弄清楚了. 微信小程序可以连接MySQL或者Sq ...
- 鸿蒙的远程交互组件应用及微信小程序的远程交互组件应用
注:鸿蒙的远程交互组件应用相对复杂 ,访问网络时,首先要配置网络权限,华为官方文档有问题,在此引用我老师配置的模板,见附件 过程:1.导入鸿蒙的网络请求模块fetch 2.发起对服务器的请求(在这过程 ...
- 微信小程序请求数据
微信小程序请求数据,在页面展示,可以在onLoad生命周期中进行请求. 1.新建目录http,新建文件http.js 2.在js文件中暴露需要使用的变量 var baseUrl = 'http://1 ...
随机推荐
- 在云服务器跑Python程序
最近在鼓弄这TensorFlow的模型,有些模型实在是太大了,CPU占用率100%不说,还一跑起来就跑个大半天,严重影响了学习的进度,所以由于手里刚有一个不大使用的云服务器,配置虽然不咋地,至少还能跑 ...
- vue初体验-ES6 基础知识补充 let 和const
本人水平有限,如内容有误,欢迎指正,谢谢. let : 主要特点: 1.作用域只局限于当前代码块.2.使用let 声明的变量作用域不会被提升.3.在相同的作用域下不能声明相同的变量.4.for循环体 ...
- 学习java的第4天 (2019-03-21 11:49)
学习java的第4天 好文要顶 关注我 收藏该文 里里零关注 - 0粉丝 - 0 0 0 posted on 2019-03-21 11:49 编辑 抱歉! ...
- Selenium2+python自动化-查看selenium API
前面都是点点滴滴的介绍selenium的一些api使用方法,那么selenium的api到底有多少呢?本篇就叫大家如何去查看selenium api,不求人,无需伸手找人要,在自己电脑就有. pydo ...
- Ansible 任务计时
在 github 发现一个 Ansible 任务计时插件“ansible-profile”,安装这个插件后会显示 ansible-playbook 执行每一个任务所花费的时间.Github 地址: h ...
- 使用maven-shade-plugin打包spring项目为可执行的jar包
使用maven-shade-plugin打包spring项目为可执行的jar包,打包后的jar包里面包含依赖的jar包. POM文件: <plugin> <groupId>or ...
- Using Dispatcher
he following code example shows how you might attempt to update the UI from your task logic. // The ...
- ELF文件加载与动态链接(一)
关于ELF文件的详细介绍,推荐阅读: ELF文件格式分析 —— 滕启明.ELF文件由ELF头部.程序头部表.节区头部表以及节区4部分组成. 通过objdump工具和readelf工具,可以观察ELF文 ...
- escu问题及解决
************************************************************** Qt 出现“undefined reference to `vtable ...
- 《深入.NET平台和C#编程》内部测试题-笔试试卷答案
1) 以下关于序列化和反序列化的描述错误的是( C). a) 序列化是将对象的状态存储到特定存储介质中的过程 b) 二进制格式化器的Serialize()和Deseria ...