作者:倒转流年1990 | 来源:互联网 | 2017-05-11 02:04
一直跟着我们手把手系列教程的朋友,对小程序的基础内容应该有一定的了解了。今天我们来实在学习一个综合案例:快递查询。项目要求:1.微信小程序显示一个快递查询的页面2.输入快递订单编号可以查看订单的流程。
一直跟着我们手把手系列教程的朋友,对小程序的基础内容应该有一定的了解了。今天我们来实在学习一个综合案例:快递查询。项目要求:
1.微信小程序显示一个快递查询的页面
2.输入快递订单编号可以查看订单的流程。
代码实现:
1,创建一个快递查询的小程序项目,如下所示:
index.wxml的代码如下:
3.在首页添加一个输入框。怎样添加一个输入框呢?可以到微信的api官方,找到小程序开发文档---组件--表单组件---输入框(input)。如下图所示:
拷贝图示的代码到我们的页面当中去,代码如下所示:
运行后我们会发现首页已经有一定输入框,如下图所示。
我们会发现这个输入框的颜色看不见,我们给这个输入框加一个样式。index.wxss的样式代码如下:
input {
border: 1px solid red;
width: 90%;
margin: 5%;
padding: 5px;
}
接下来我们要在首页添加一个查询按钮。怎么样添加查询按钮呢?小程序开发文档---组件--表单组件---按钮(button),参照官方示例,我们在wxml页面新增代码
保存调试后页面的如下:
通过微信官方的API发起网络请求
更多微信小程序开发:快递查询相关文章请关注PHP中文网!