首页 物流新闻 微信小程序-小帮手

微信小程序-小帮手

1  事例功用详解 麻雀虽小,五脏俱全,本事例有 5 大功用: 身份证,手机号,银行卡号,身段目标等查询。 快递查询 气候查询 扫雷小游戏,摇色子 2.界面如下: 3.事例程序结构…




事例功用详解

麻雀虽小,五脏俱全,本事例有
5
大功用:


  1. 身份证,手机号,银行卡号,身段目标等查询。

  2. 快递查询

  3. 气候查询

  4. 扫雷小游戏,摇色子

2.界面如下:


3.事例程序结构


4.调用登录:


首要页面代码





5.主页wxml

!--pages/index/index.wxml--

view class="index-body"

!--  页面翻滚部分  --

swiper class="swipr-box" indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="true"

block wx:for="{{imgUrls}}" wx:key="{{list}}"

navigator url="{{item.openpath}}" hover-class="none" open-type="navigate"



swiper-item

image src="{{item.img}}" class="slide-image banner-img" /


/
swiper-item


/
navigator


/
block


/
swiper

!--  页面服务部分  --

view class="server-box"

!--服务  --

view class="server-t"

view class="server-text fs26"海 洋 查 询 服 务/view


/
view

!--列表  --

view class="list-server"

!-- 循环 --

view class="listbox" wx:for="{{server}}" wx:key="img"

navigator url="{{item.openpath}}" hover-class="none" open-type="navigate"



view

image src="{{item.img}}" class="listimg" /


/
view

view class="fs28"

{{item.text}}


/
view


/
navigator


/
view


/
view

view class="clear"/view


/
view

!--  页面待开发部分  --

view class="server-box inm"

!--服务  --

view class="server-t"

view class="server-text fs26"仍在开发中,暂未敞开☺.../view


/
view

!--列表  --

view class="list-server"

!-- 循环 --

view class="listbox" wx:for="{{unserver}}" wx:key="img"



view

image src="{{item.img}}" class="listimg" /


/
view

view class="fs28"

{{item.text}}


/
view


/
view

view class="clear"/view


/
view


/
view


/
view







6.气候页面wxml主文件

!--pages/weather/weather.wxml--

view class="bgc-w"

!--  定位地址  --

import src="../../model/model.wxml" /

template is="areaData" data="{{...item}}" /

view class="wt-box"

view class="fs28 fcff wt-d" bindtap="translate"{{my}}/view

image src="../../images/wz.png" class="wz-img" /

/
view

!-- 页面显现气候部分  --

view class="wt-text"

view class="fcff"

{{liveweather.tmp}}℃

/
view

/
view

view class="mainbox"

image src="../../images/svg/{{liveweather.cond_code}}.svg" class="mainimg" /

/
view

view class="wt-text"

view class="fcff"

{{liveweather.cond_txt}}

/
view

/
view

!-- 详细信息  --

view class="detbox"

!-- 五条数据 --

view class="detlist"

view class="fcff fs28 det-tt"体感湿度/view


view

image src="../../images/sd.png" class="detimg" /

/
view

view class="fcff fs28"{{liveweather.hum}}/view

/
view

!-- 五条数据 --

view class="detlist"

view class="fcff fs28 det-tt"降水量/view


view

image src="../../images/jstj.png" class="detimg" /

/
view

view class="fcff fs28"{{liveweather.pcpn}}/view

/
view

!-- 五条数据 --

view class="detlist"

view class="fcff fs28 det-tt"风向/view


view

image src="../../images/fx.png" class="detimg" /

/
view

view class="fcff fs28"{{liveweather.wind_dir}}/view

/
view

!-- 五条数据 --

view class="detlist"

view class="fcff fs28 det-tt"风力/view


view

image src="../../images/fl.png" class="detimg" /

/
view

view class="fcff fs28"{{liveweather.wind_sc}}/view

/
view

!-- 五条数据 --

view class="detlist"

view class="fcff fs28 det-tt"风速/view


view

image src="../../images/fs.png" class="detimg" /

/
view

view class="fcff fs28"{{liveweather.wind_spd}}/view

/
view

view class="clear"/view

/
view

!-- 未来三气候候  --

view class="threebox"

!-- 三天 --

view class="threelist fcff fs30"

view class="leftbox"今日 {{three[0].date}}/view

view class="centerbox"

view class="dp-ib threeimgbox"

image src="../../images/svg/{{three[0].cond_code_d}}.svg" class="detimg threeimg" /

view class="dp-ib threetext"

{{three[0].cond_txt_d}}

/
view

/
view

/
view

view class="rightbox"{{three[0].tmp_min}}℃ ~ {{three[0].tmp_max}}℃/view

/
view

!-- 三天 --

view class="threelist fcff fs30"

view class="leftbox"明日 {{three[1].date}}/view

view class="centerbox"

view class="dp-ib threeimgbox"

image src="../../images/svg/{{three[1].cond_code_d}}.svg" class="detimg threeimg" /

view class="dp-ib threetext"

{{three[1].cond_txt_d}}

/
view

/
view

/
view

view class="rightbox"{{three[1].tmp_min}}℃ ~ {{three[1].tmp_max}}℃/view

/
view

!-- 三天 --

view class="threelist fcff fs30"

view class="leftbox"后天 {{three[2].date}}/view

view class="centerbox"

view class="dp-ib threeimgbox"

image src="../../images/svg/{{three[2].cond_code_d}}.svg" class="detimg threeimg" /

v

本文来自网络,不代表快递资讯网立场。转载请注明出处: http://www.llaiot.com/logistics-news/2360.html
上一篇
下一篇

为您推荐

返回顶部