258资源分享网

新公司上手小程序。
30天，从入门到现在，还没放弃。。。

虽然小程序发布出来快一年了，爬坑的兄弟们大多把坑都踩平了。而我一直停留在“Hello World”的学习阶段。
一来没项目，只有项目才是实践学习的根本；
二来刚出来，总是有很多坑。爬坑总是痛并快乐着。

再多的借口，产品项目需求拍在桌前，都得缴械投降。
不要怂撸起袖子，就是干。

微信推出小程序，想要实现即开即用，用完即走的用户体验。免去APP下载安装繁琐的流程。听起来像谷歌推出的PWA，不过PWA普及到国内还有段时间。而小程序借助于微信的用户群体，植入成本低，容易被用户接受。

小程序的代码风格跟Vue其实挺像，对于习惯Vue开发模式的同学，上手并没有太大的问题。

小程序不支持前端主流框架，如Vue，Angular，React，jQuery等，而且小程序有自己的一套视图容器(Dom)的写法，跟平常我们在web上写HTML不一样。不过CSS3那些变化不大。虽然文件名改成了(.wxss)

本司项目，使用webpack做打包工具，将代码编译成符合小程序的代码目录规范，采用wechat-mina-loader插件，实际开发起来跟在Vue下开发习惯一样。
babel完成ES6转ES5，sass编译，压缩转化等工作都放到webpack中去做。

小程序脚本内不能使用window,document对象，所以无法操作dom。如果想操作节点，可用wx.createSelectorQuery()

另外数据驱动的开发模式，跟Vue相同，只是写法换了（vue: v-if，小程序: wx:if）

rpx（responsive pixel）: 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。

设计师做设计图以iPhone6作为设计稿基准就可以，基本上可以用rpx替换px，不过在一些表单或者提示页面，使用设计稿上的rpx会让小屏幕手机看着尺寸略小，提示页面可参照weui用px来实现

wx.navigateTo(OBJECT)

保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面

wx.redirctTo(OBJECT)

关闭当前页面，跳转到应用内的某个页面

wx.switchTab(OBJECT)

跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面

wx.reLaunch(OBJECT)

关闭所有页面，打开到应用内的某个页面

小程序只能同时打开打开5个页面，当打开5个页面后，wx.navigateTo不能正常打开新页面，请避免多层级的交互方式，或者使用wx.redirctTo重定向

tabBar是一个数组。配置最少2个，最多5个，tab数组按顺序排序

基础库1.4.0支持

CSS中无法使用本地资源(开发目录中)的图片作为background-image。可以使用网络图片资源，或base64，或者使用image标签。tabBar的icon资源可使用本地资源

每个用户在每个小程序里面都有唯一的openid，如果想在多个公众号，小程序里面共享用户信息，统一识别该用户，则需要用到unionid。为了获取uniond则需要注册微信开放平台，将需要共享的小程序，公众号进行绑定（不超过10个，超过10个还要申请认证称为第三发平台）。

textarea,map等组件是由客户端创建的原生组件，它的层级是最高的。如果有遇到定位元素的话。永远在最上面，盖不住。

请勿在 scroll-view、swiper、picker-view、movable-view 中使用 textarea 组件

CSS动画对textarea无效

项目场景：页面底部固定了一个按钮（position:fixed), 页面滚动时，textarea总是在按钮上面，点击按钮就点到了textarea

app.js中配置

navigationBarTextStyle 导航栏标题颜色仅支持black/white
状态栏，导航条，标题，窗口背景色支持纯色，不支持渐变色

url中添加参数，如url?a=1&b=2, onLoad(options) options.query.a, options.query.b可获取到

扫描小程序码进页面，如果想获取小程序码url中所带的参数，可通过options.scene获取，不过需要对二维码中的scene值进行转换decodeURIComponent(options.scene), 调试阶段可以使用开发工具的条件编译自定义参数 scene=xxxx 进行模拟，开发工具模拟时的 scene 的参数值需要进行 urlencode (启动参数：scene=n%3D1001) 实际为scene=n=1001，参数n=1001