微信小程序教程笔记4
综合案例-快递查询
apistore.baidu.com
http://apistore.baidu.com/ seems to be disabled, no way to access
<!--index.wxml-->
<view class="container"><input placeholder="请输入运单号" bindinput="input"/><button type="primary" bintap="btnClick">查询</button><scroll-view scroll-y="true" style="height:200px;"><view wx:for="{{expressInfo.data}}">{{item.context}}【{{item.time}}】</view></scroll-view>
</view>
//index.js
//获取应用实例
const app = getApp()Page({data: {motto: 'Hello World',userInfo: {},hasUserInfo: false,canIUse: wx.canIUse('button.open-type.getUserInfo'),expressNu:null,expressInfo:null},//getExpressInfogetExpressInfo:function(nu,cb){wx.request({url: 'http//apis.baidu.com/kuaidicom/express_api/express_api?muti=0&order=desc&nu=' + nu,data:{x:'',y:''},header:{'apikey':'2d24c33be1e7fdafebc496c07441138'},success:function(res){// console.log(res.data)cb(res.data)}})},
//bntClick
bntClick:function(){var thispage=this;console.log(this.data.expressNu)app.getExpressInfo('806820160474',function(){dataconsole.log(data);thispage.setData({expressInfo:data})});
},
//input
input:function(e){//console.log(e)this.setData({expressNu:e.detail.value})
},bindViewTap: function() {wx.navigateTo({url: '../logs/logs'})},onLoad: function () {if (app.globalData.userInfo) {this.setData({userInfo: app.globalData.userInfo,hasUserInfo: true})} else if (this.data.canIUse){// 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回// 所以此处加入 callback 以防止这种情况app.userInfoReadyCallback = res => {this.setData({userInfo: res.userInfo,hasUserInfo: true})}} else {// 在没有 open-type=getUserInfo 版本的兼容处理wx.getUserInfo({success: res => {app.globalData.userInfo = res.userInfothis.setData({userInfo: res.userInfo,hasUserInfo: true})}})}},getUserInfo: function(e) {console.log(e)app.globalData.userInfo = e.detail.userInfothis.setData({userInfo: e.detail.userInfo,hasUserInfo: true})}
})
/**index.wxss**/
input{border:1px solid red;width:90%;margin: 5%;padding:5px;
}
微信小程序教程笔记4相关推荐
- 微信小程序开发笔记一
微信小程序开发笔记 一.微信小程序的结构 1.初识小程序 2.快捷键 3.查阅文档 二.常用组件 1.input组件 2.button组件 三.小程序中的函数 1.函数的两种定义方法 2.带参函数 3 ...
- 微信小程序开发-笔记
一.开发文件结构 1.根目录下有三个文件:app.js,app.json和app.wxss.一个小程序项目必须有的三个描述App的文件.这三个文件是应用程序级别的文件.这3个文件的意义: 表1.1 ...
- 一个C#程序员学习微信小程序的笔记
一个C#程序员学习微信小程序的笔记 客户端打开小程序的时候,就将代码包下载到本地进行解析,首先找到了根目录的 app.json ,知道了小程序的所有页面. 在这个Index页面就是我们的首页,客户端在 ...
- 小程序 pagescrollto_微信小程序学习笔记(三)-- 首页及详情页开发
一.常用组件 在上一个章节中讲解了封装请求数据的模块,在此处请求轮播图的数据 1.首页轮播图数据的请求以及渲染 1.1 轮播图数据的请求 pages/home/home.js import 2 使用组 ...
- 云开发(微信-小程序)笔记(十四)---- 收藏,点赞(上)
云开发(微信-小程序)笔记(十三)---- 注册登陆 1.简介 点赞,收藏等都是程序的最简单的功能,在现实的应用中也很常见.这里我就来给大家介绍一下小程序的这个功能. 图标下载地址 先去网站上http ...
- 微信小程序PHP注册,微信小程序 教程之注册页面
微信小程序――Page Page()函数用来注册一个页面.接受一个object参数,其指定页面的初始数据.生命周期函数.事件处理函数等. object参数说明: 属性 类型 描述 data Objec ...
- 微信小程序开发笔记,你收藏了吗?
** 微信小程序开发笔记,你收藏了吗? ** 最近在开发微信小程序,把自己在项目中经常遇到的知识点记录下来,以便下次开发的时候查看. 开发小程序开发工具推荐vscode写代码,微信开发工具用于查看效果 ...
- 微信小程序开发笔记 进阶篇④——getPhoneNumber 获取用户手机号码(小程序云)
文章目录 一.前言 二.前端代码wxml 三.前端代码js 四.云函数 五.程序流程 一.前言 微信小程序开发笔记--导读 大部分微信小程序开发者都会有这样的需求:获取小程序用户的手机号码. 但是,因 ...
- 微信小程序开发笔记 进阶篇⑤——getPhoneNumber 获取用户手机号码(基础库 2.21.2 之前)
文章目录 一.前言 二.前端代码wxml 三.前端代码js 四.后端java 五.程序流程 六.参考 一.前言 微信小程序开发笔记--导读 大部分微信小程序开发者都会有这样的需求:获取小程序用户的手机 ...
- 微信小程序学习笔记(1)
微信小程序学习笔记 1.小程序代码结构 2.逻辑层和视图层 3. 小程序的宿主环境(通信模型.运行机制.组件.API) 4. 数据绑定和事件绑定 1.小程序代码结构 当开发者新建一个工程时,项目文件包 ...
最新文章
- 连影--影子007的回忆
- 分享基于Entity Framework的Repository模式设计(附源码)
- Cissp-【第1章 安全和风险管理】-2020-12-31(86页-98页)
- python六十三: __call__
- python中csv文件通过什么表示字符_python – 如果行包含CSV文件中的字符串,则删除该行...
- python怎么打印出文件的内容_Python---进阶---文件操作---按需求打印文件的内容
- .Net Core in Docker极简入门(下篇)
- junit 验证日志输出_JUnit规则–引发异常时执行附加验证
- 衡量试卷难度信度_我们可以通过数字来衡量语言难度吗?
- java反射回调函数_java回调函数
- c++ string 数组_PHP数组与字符串之间相互转换的方法
- AES加密,解决了同步问题,和随机密钥和固定密钥,多端通信加密不一致解决办法...
- UVA10302 Summation of Polynomials【数学】
- Atitit 大脑能够储存多大的数据量
- 线性系统大作业——1.一阶倒立摆建模与控制系统设计
- 简析H264编码中的GOP
- 笔记本通过网线连接台式机共享网络
- 如何做一款有灵魂的App——关于hope的启发以及对于追梦App的思考
- 《数据结构教程(李春葆主编 第五版)》第七章源代码—树和二叉树
- java excel文件损坏_SpringBoot下载Excel文件,解决文件损坏问题(示例代码)