nice,赶上了第一波小程序,自己开发得一个应用上线啦,不容易呀,尤其是微信审核,往返5次左右才通过审核,在这里给大家分享一些有用的信息(其实开发过程也碰到了很多细节上的小坑,不过微信升级比较频繁,有些解决了,细节上的有些忘记了,可以留言一起讨论下)
1、审核不通过原因总结:
2、Promise
我这边使用的是es6-promise,推酷上采用某位大神的方式
yarn add es6-promise --save
使用(根据自己公司的接口情况,自己封装一下,使用比较方便):
import Promise from './lib/es6-promise';
request(params).then((res) =>{
}).catch((err) => {
}).finally(() => {
});
3、tab图片注意事项
icon最好留下透明边距,默认会图片全部拉伸适应的,刚开始安卓会固定大小自动去适配挺好看的,iPhone不行,现在两边都不做处理了,所以icon得自己做下透明边距,不然超难看的
4、css3支持的不是很全(选择器nth-child不支持),wxss又有点像sass、less之类但是功能又远不如,比较鸡肋,将就用吧。wxml节点上用起来挺不爽的,微信自己整了一套规范出来了,人家的平台想咋整咋整,原理上和html差不多
.loading view {
background-color: #ddd;
width: 10px;
height: 10px;
border-radius: 100%;
margin: 2px;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
display: inline-block;
}
@-webkit-keyframes scale {
0% {
-webkit-transform: scale(1);
opacity: 1;
}
45% {
-webkit-transform: scale(0.1);
opacity: 0.7;
}
80% {
-webkit-transform: scale(1);
opacity: 1;
}
}
@keyframes scale {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
}
45% {
transform: scale(0.1);
opacity: 0.7;
}
80% {
transform: scale(1);
opacity: 1;
}
}
.loading .ball-1 {
animation: scale 0.75s 0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-webkit-animation: scale 0.75s 0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
.loading .ball-2 {
animation: scale 0.75s 0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-webkit-animation: scale 0.75s 0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
.loading .ball-3 {
animation: scale 0.75s 0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
-webkit-animation: scale 0.75s 0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
}
其实过程中还碰到不少坑,记不清了,第二版再给大家总结下,有啥问题大家一起讨论~