微信小程序开发记录文档02

一、小程序应用场景

小程序主打的是比APP更轻量的形态,简单的开发,却接近app的体验,无需下载,扫码打开。一些高频的金融类、电商类、教育类等其实是不适合接入小程序的。这些应用服务对功能的要求都很重,小程序难以承载。而且小程序不能像微信公众号一样被关注、群推送消息以及转发朋友圈,这也就意味着,它没有办法获取用户更多的信息,也不便于深度营销。

主打适合小程序的产品:

* 初创型企业的MVP产品

*开发和设计能力有限的产品

*功能轻、用完即走、非即时、可异步

*基于轻社交场景应用、跨平台使用

二、从操作 DOM 转为操作数据

微信开放的接口更为严谨,结构必须采用他提供给我们的组件,外部的框架和插件都不能在这里使用,让开发者完全脱离操作 DOM,开发思想转变很大。

生命周期:( 从index.js文件看)

1) 在首页的console 可以看出顺序是 App Launch-->App Show-->onload-->onShow-->onReady。

首先是整个 app 的启动与显示,app 的启动在 app.js 里面可以配置,其次再进入到各个页面的加载显示等等。

例如,App()函数用来注册一个小程序,接受一个Object参数,其指定小程序。

生命周期函数等。

App({

onLaunch: function() {

// Do something initial when launch.

},

onShow: function() {

// Do something when show.

},

onHide: function() {

// Do something when hide.

},

globalData: 'I am global data'

})

2)小程序的开发是基于微信提供的一套应用框架进行开发的。微信通过封装微信客户端提供的文件系统、网络通信、任务管理、数据安全等基础功能,对上层提供了一套完整的Javascript Api,使得开发者能够非常方便的使用到微信客户端提供的各种基础功能,快速构建一个应用。

框架提供了自己的视图层描述语言 WXML 和 WXSS,以及基于 JavaScript 的逻辑层框架,并在视图层与逻辑层之间通过**单向数据绑定**进行数据传输,使开发者更加聚焦于数据与逻辑上。

三、新建的项目各文件详解:

1) pages文件夹:是页面管理文件夹

下面一般可以自定义页面,如demo中的index欢迎页面。首页index页面包含几个文件:index.js,index.wxss,index.wxml,index.json

先来逐一介绍下这些文件是干嘛的。

index.js文件是以js结尾的文件,是页面的脚本文件,在这个文件中我们可以监听并处理页面的生命周期函数,获取小程序实例,声明并处理数据,响应页面交互事件等。是必须要的。

index.wxml文件是页面的结构文件(类似于H5的html标记文件)。是必须要的。

index.wxss文件是页面的样式表。非必要。当有页面样式表文件时候,页面样式表中的样式规则会层叠覆盖app.wxss文件中的样式规则。如果不指定页面的样式规则表,也可以在页面的结构文件中直接使用app.wxss中指定的样式规则。

index.json文件是页面的配置文件。非必要。当有页面的配置文件时候,配置项在该页面会覆盖app.json文件中的window中相同的配置项,如果没有指定配置文件,则在该页面直接使用app.json中的默认配置文件。

2) app.js文件是小程序的脚本代码。监听并处理小程序的生命周期函数,并声明全局变量,调用框架的API,同步存储和同步读取本地数据。


小程序的获取日志的脚本代码

js代码中定义了一个App对象,该对象包含onLaunch, getUserInfo两个方法和globalData成员变量。

其中onLaunch方法会在程序启动时由框架来进行调用。在该方法中,程序通过微信提供的本地存储接口getStorgeSync()获取了一个logs变量,第一次获取时会返回空,这时将变量初始化为空数组。之后在数组头部添加一个格式化的时间字符串,之后将数组变量存储在本地。

getUserInfo方法需要调用者传递一个名为cb的参数,首先判断是否获取过用户信息,如果获取过并且cb是函数的话,就会调用cb函数并将globalData成员变量传递进去,否则将调用wx.login接口来获取用户信息。在调用wx.login时,传递了一个匿名函数进行调用成功后的逻辑处理,就是success后面的部分。可以看到这里只有函数定义而没有函数名称,因此除了作为回调函数外,也无法在其它地方调用该函数。

在回调函数中执行了that.globalData.userInfo = res.userInfo来保存用户信息,其中that变量由var that = this赋值,因此该变量指向app对象本身,所以才能成功保存用户信息。

我们可以看到that对象是getUserInfo方法栈上的变量,如果没有闭包技术,此处的匿名回调函数是不能直接使用that变量的,就需要将app对象传递给回调函数(全局变量或函数参数的方式),而在闭包技术的支持下,回调函数可以像使用函数内部变量一样来访问that变量。

 globalData是成员变量,该成员包含userInfo变量,用来保存用户信息。







3)app.json文件是对整个小程序的全局配置。可以在该文件中配置小程序有哪些页面组成,配置小程序窗口背景,配置导航条样式,配置默认标题。(注意,不可添加注释)

4)app.wxss文件是小程序的公共样式表文件。我们可以在页面组件的class属性上直接使用app.wxss文件中声明的样式规则。 在index.wxss中设计组件位置和属性样式。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,902评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 84,037评论 2 377
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,978评论 0 332
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,867评论 1 272
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,763评论 5 360
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,104评论 1 277
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,565评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,236评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,379评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,313评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,363评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,034评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,637评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,719评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,952评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,371评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,948评论 2 341

推荐阅读更多精彩内容