专注连锁门店会员营销管理系统
线上+线下+进销存+收银+会员2018-05-22 作者:秩名
分析源码之前,我们先来回顾一下,wepy 的使用:
<!-- 小程序入口 app.wpy --> <script> import wepy from 'wepy'; export default class extends wepy.app { ...... } </script>
让我们一起看看 export 出来的 class,是怎么转换成小程序语言的。
在《深入wepy源码:wpy文件编译过程》中,我们介绍了 wepy-cli 是如何编译 wpy 文件的,里面有说到,complie-script.js 在处理 script 代码时,会加入 wepy 初始化的代码。编译之后 dist 目录下的文件,如下:
// dist/app.js App(require('./npm/wepy/lib/wepy.js').default.$createApp(_default, {})); // dist/pages/index.js Page(require('./../npm/wepy/lib/wepy.js').default.$createPage(Index , 'pages/index'));
可以看出,主要调用了 $createApp 和 $createPage 方法。在看这两个方法之前,我们先来看一下 wepy 的目录结构,以便后面的分析更好理解。
├─wepy ├─src ├─app.js 全局app逻辑,请求优化、promisify API、拦截器功能等 ├─base.js 定义了 $createApp 和 $createPage 等方法 ├─component.js 组件逻辑,脏值检查、组件通信等 ├─event.js 事件方法 ├─mixin.js 混合方法 ├─native.js 空,代码里用于app.js中重新定义wx接口 ├─page.js 继承component,page的一些优化 ├─util.js 工具方法 ├─wepy.js 入口文件 ├─test ├─...
// dist/app.js App(require('./npm/wepy/lib/wepy.js').default.$createApp(_default, {}));
$createApp() 返回了一个类型为 object 的 config,里面包含了 ['onLaunch', 'onShow', 'onHide', 'onError'] 这些方法。
还执行了 $initAPI(),主要利用 Object.defineProperty 的 get 方法,将返回封装为 promise,这里也是 API 实现 promise 写法的核心。
// dist/pages/index.js Page(require('./../npm/wepy/lib/wepy.js').default.$createPage(Index , 'pages/index'));
$createPage() 和 $createApp() 类似,只不过是返回的是 Page 的方法,此外,还在生命周期中,添加了数据脏值检查 $apply()。
wepy 使用脏数据检查对原生小程序 setData 进行封装,在函数运行周期结束时执行脏数据检查。如果在异步函数中更新数据时,则需要手动执行 $apply()。
在 $createPage() 中,会在生命周期中调用 $apply(),来看一下它的定义:
$apply (fn) { if (typeof(fn) === 'function') { fn.call(this); this.$apply(); } else { if (this.$$phase) { this.$$phase = '$apply'; } else { this.$digest(); } } }
$$phase 标识是否有 脏数据检查 在运行,如果没有,则执行 $digest()。
$digest() { let k; let originData = this.$data; this.$$phase = '$digest'; this.$$dc = 0; while (this.$$phase) { this.$$dc++; if (this.$$dc >= 3) { throw new Error('Can not call $apply in $apply process'); } ...... this.$$phase = (this.$$phase === '$apply') ? '$digest' : false; } }
$digest() 执行时,主要是遍历 originData,将 originData[k] 和 this[k] 做对比,如果不一样,放到 readyToSet中,在循环之后,统一执行 setData 方法。
最后,在检查 $$phase 是否有被设置为 '$apply',如果是,则再做一次脏数据检查。
线上+线下+进销存+收银+会员门店零售管理好帮手
门店能实现快速收银,提升门店经营效率。
系统自带进销存管理,更好管理库存销售。
配备收银硬件一站式整体服务。
收 银 会员管理 库存管理 商品管理 交接班 数据报表 营销促单 售后处理 多种收款
获取报价推荐文章
最新消息总结,开发一个小程序我们可以选择的第三方框架有5种,大家比较熟悉的有美团小程序框架mpvue,还有组件化框架等...
最近在调研小程序的分享能力,本篇文档主要是调研小程序关于分享方面的玩法,目的是学习小程序在项目应用以及玩法链上...
许多人在使用小程序,会有一个很麻烦的事情,就是使用过小程序之后,会不断的发送自己的定位消息,那么这个小程序的...
一款小程序,很多时候需要调用内置的照相机,实现拍照并图片上传,那么要如何实现呢?...
新零售模式的发展,传统酒水行业通过开创体验式的经营模式,来提升顾客的个性化服务,已经成为实现酒类行业的热门趋势...
现阶段美容行业的运营很不规范,虽然经过一轮一轮的实践之后,有很多美容店已经了解到信息化管理系统的重要性,但在实...
2024年怎样开加盟连锁店第七步(建立品牌知名度) 建立品牌知名度是成功创建一个加盟连锁品牌的关键步骤。一个强大的品...
2024年怎样开加盟连锁店第三步(开发一个详细的加盟手册) 加盟手册的重要性 加盟手册是加盟连锁品牌成功的基础组成部分...
在零售行业,线上线下一体化营销已经成为企业提升竞争力的关键策略。根据9的分析,2024年中国零售行业的数字化转型正在...
在数字化转型的浪潮中,线上线下推广方案已成为零售企业连接顾客、提升销售的关键策略。友数连锁,作为HiShop推出的新零...