项目中的业务需求

格式化时间

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
const formatTime = date => {
const year = date.getFullYear();
const month = date.getMonth()+1;
const day = date.getDate();
const hour = date.getHours();
const minute = date.getMinutes();
const second = date.getSeconds();
return [year,month,day].map(foramtNumber).join('/')+ ' '+[hour,minute,second].map(formatNumber).join(':');
}

//不超过10的月日时分秒就在前面加上0
const formatNumber = n => {
n = n.toString()
return n[1] ? n : '0' + n
}

时间戳

1
let timeStamp = new Date().getTime();

将参数转为地址传参

1
2
3
4
5
6
7
8
9
// 把参数变为地址传参
const transformUrlData(obj) {
let str = ''
for (let k in obj) {
str += k + '=' + obj[k] + '&'
}
str = str.substring(0, str.length - 1)
return str
},

getCurrentPages()的使用

getCurrentPages()函数用于获取当前页面栈的实例,以数组的形式按栈的顺序给出1,第一个元素为首页,最后一个元素为当前页面。

注意:

  1. 不要尝试改变页面栈,会导致路由以及页面状态错误。
  2. 不要在App.onLaunch的时候调用getCurrentPages(),此时pages还没有生成。
常用场景
  1. 利用页面栈的长度

如:进入小程序非默认首页时,需提供返回首页按钮或者执行其他事件。

1
2
3
4
onShow(){
let pages = getCurrentPages(); //当前页面栈
if(pages.length == 1){}
}
  1. 跨页面赋值
1
2
3
4
5
let pages = getCurrentPages();
let prevPage = pages[pages.length - 2]; //上一个页面
prevPage.setData({
//直接给上一页面赋值
});
  1. 页面跳转后自动刷新
1
2
3
4
5
6
7
8
wx.switchTab({
url: '../index/index',
success: function (e) {
var page = getCurrentPages().pop(); //当前页面
if (page == undefined || page == null) return;
page.onLoad(); //或者其它操作
}
})
  1. 获取当前页面相关信息
1
2
3
4
5
6
7
8
let pages = getCurrentPages(); //当前页面栈
//当前页面为页面栈的最后一个元素
let prevPage = pages[pages.length - 1];//当前页面
or
// pop() 方法用于删除并返回数组的最后一个元素
let prevPage = pages.pop();//当前页面

console.log( prevPage.route) //举例:输出为‘pages/index/index’

埋点

埋点分析,是网站分析的一种常用的数据采集方法。数据埋点是一种良好的私有化部署数据采集方式。数据埋点分为初级、中级、高级三种方式,分别为:

初级:在产品、服务转化关键点植入统计代码,据其独立ID确保数据采集不重复(如购买按钮点击率);

中级:植入多段代码,追踪用户在平台每个界面上的系列行为,事件之间相互独立(如打开商品详情页——选择商品型号——加入购物车——下订单——购买完成);

高级:联合公司工程、ETL采集分析用户全量行为,建立用户画像,还原用户行为模型,作为产品分析、优化的基础。

无疑,数据埋点是一种良好的私有化部署数据采集方式。数据采集准确,满足了企业去粗取精,实现产品、服务快速优化迭代的需求。

但,因手动埋点工程量极大,且一不小心容易出错,成为很多工程师的痛。且其开发周期长,耗时费力,很多规模较小的公司并不具备自己埋点的能力。无埋点成为市场新宠。最后埋点、无埋点两种技术谁能成为最后赢家,我们拭目以待。

runtime-compiler和runtime-only的区别

runtime-compiler时:当我们将template模板传给vue的时候,vue会做一个保存,就是将该模板保存到vue实例上的options上,保存后将template解析(parse)成抽象语法树(abstract syntax tree,即ast),再将ast转成render函数后再生成虚拟DOM树,最后转成真实的UI。template——> ast ——> render——> vdom ——> UI。

runtime-only:render——> vdom ——> UI,这样这种方式的性能更高,代码量较少。

文章目录
  1. 1. 格式化时间
  2. 2. 将参数转为地址传参
  3. 3. getCurrentPages()的使用
    1. 3.0.1. 常用场景
  • 4. 埋点
  • 5. runtime-compiler和runtime-only的区别
  • |