一天入门微信小程序基本操作

张凯

2019.12.23

110人浏览

通过几天学习完成的一个练习小项目

开发项目:微信小程序

开发工具:微信开发者工具

作者:汐

项目详情:

1.整体页面展示

一天入门微信小程序基本操作

这次的联系是一个综合娱乐站的类型

包括四个大模块 :首页 新闻 娱乐 问答

可以看到这里底部的tabBar

显示当前页被选中 图标和文本颜色都是绿色

其他页面都是灰色的一个状态

首页整体的功能是展示 并且让用户登入


tabBar的一些样式设计 

要注意的是分页最少两页最多五页

一天入门微信小程序基本操作


2.新闻页面功能展示

一天入门微信小程序基本操作


打开新闻模块的时候 上方会生成轮播图 轮播最新的实时新闻

下方应用了scroll-view组件

可以生成滚屏新闻展示区域

当下拉时 会重新拉取最新的新闻 形成刷新操作

为保证加载速度和用户体验 一次性只会展示十条新闻

当看完最后一条新闻后 会继续渲染新的新闻内容

1.0.1版本新增了关键词查询功能 

可以根据关键字搜索自己想看的新闻

一天入门微信小程序基本操作

具体操作是应用了indexOf()方法 

通过用户输入的内容匹配了相应的字符串

实现了数据筛选 再将页面重新进行渲染

一天入门微信小程序基本操作


3.娱乐页面功能展示

这次的娱乐的页面简单的练习了input输入框传值 

使用的是极速数据 历史上的今天 接口

通过bindinput绑定函数就可以改变数据给接口传值了

返回的数据再来渲染页面

一天入门微信小程序基本操作


4.智能问答页面功能展示

同样也是练习传值调接口数据 

只要明白学会了方法 就可以举一反三 

实现各种各样常用的功能

一天入门微信小程序基本操作

这里还测试了movable-area组件

数据双向绑定可以实时反映出movable-view的坐标

一天入门微信小程序基本操作

这一段时间的微信小程序开发很充实很有收获

雕虫小技 也看到了自己的不足 

需要继续学习和完善的地方还有很多

感谢阅读









张凯    266 天津市河东区 设计师杨冰是女孩 1995.02.06
京ICP备17020986号-1
设计师啪啪网2019版