11月深秋,由CSDN知识库尚林凯进行了小程序开发的技术分享。一起谈谈小程序开发给技术人带来的影响,如何开发小程序,以及在开发过程中踩过的坑。
什么是小程序
小程序是微信推出的一种新的公众号的形态
不需要下载安装即可在微信中使用的应用
小程序、订阅号、服务号、企业号是并行的体系
微信小程序在微信开发中的位置
微信小程序开发MINA框架
- 尽可能简单、高效的方式让开发者可以在微信中开发
- 具有原生 APP 体验的服务
小程序为开发者提供了什么
小程序提供了一个框架,微信称之为mina,这个框架主要分两个层面,视图层和逻辑层。框架的核心是一个响应的数据绑定系统。WXML 中的动态数据均来自对应 Page 的 data,这个数据绑定是单向的,只有数据发生变化,视图才会做出相应的调整。这种模式,让开发者专注于事件处理上,改变对象状态,实现视图更新。
为了方便以及限制开发者开发,微信自己定义了一系列的基础组件,就是视图层的组成单元(表单组件,媒体组件,导航等),组件自带一些功能与微信风格的样式,类似html标签。微信还提供了很多原生的微信api,用来调用微信内部提供的功能,以及一个微信小程序开发者工具。
微信小程序源码结构
视图层(将逻辑层的数据展现在视图上)
逻辑层(通过改变数据[setData方法]来改变视图)
配置文件
在小程序中,微信规定了界面的组成模式,由四个文件组成。
.wxml文件(页面结构文件)标签语言,类似html,真正负责页面结构的文件,可以绑定数据。
.wxss文件(样式表文件)类似css,大部分css样式都相同
.js文件(脚本文件)用来运行我们的逻辑,使用js语言
.json文件(配置文件)主要配置公用的样式,比如tab栏,窗口样式等
知识库微信小程序开发的例子
CSDN小程序开发初步尝试,关注的重点是js文件和wxml文件。
知识库把开发领域细分成某个领域,例如技术语言,运维系统,行业应用等方面,对每个技术和知识点都设计一个网状图谱,来总结技术某一方面涉及到的知识,同时为知识结构准备一些精品的内容。方便大家更系统的学习知识。
在知识库这个产品上,需要实现内容推荐,个人中心以及搜索。用户侧和内容推荐测,都包括四层:库-》知识结构-》内容列表-》内容详情页。搜索功能可以根据用户搜索的关键词找到用户侧或者推荐里的相关内容。方便用户阅读和收藏。
知识库页面设计
小程序组件满足了所有的显示功能和结构(列表,窗口,按钮,事件)
API齐全,便于逻辑开发。不同的功能模块放在不同的页面里。
- 视图层: tab栏,列表页,知识结构页,内容详情页,搜索页
- 逻辑层:
tab栏->通过绑定数据index选择一级页面
列表页->通过改变绑定数据contentlist数组,控制列表显示和动态加载
搜索页->通过绑定数据searchValue,通过事件及时获取用户输入 |