支付宝小程序开发中总结（微信小程序开发总结）
今天给各位分享支付宝小程序开发中总结的知识，其中也会对微信小程序开发总结进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！
本文目录一览：
- 1、支付宝小程序怎么开发？
- 2、「技术」支付宝小程序开发笔记
- 3、MPX 开发(微信、支付宝、百度)小程序遇到的问题
- 4、二、支付宝小程序前端样式的设计.acss样式详解
- 5、支付宝小程序怎么用 你用过吗
- 6、记录一下支付宝小程序的坑
支付宝小程序怎么开发？
支付宝的小程序公测以来，引起大量的用户流量。支付宝的小程序向企业开户，让商户开发专属自己的小程序应用。那么，如何在支付宝客户端开发小程序?下面小编手把手教您操作。
支付宝的小程序组成部分类型：
1、js负责页面逻辑。
2、xml负责页面结构。
3、css负责页面样式。
4、json负责页面配置。
支付宝的小程序积累了技术经验。组件采用了蚂蚁的支付宝设计，其自身的特色功能封装在开放的流程中。在框架方面，采用开源React/webpack等技术。
支付宝的小程序开发特点：
1、基于 Web 技术，学习成本低。
2、一套代码，同时支持 iOS 和 Android，接近原生体验。
3、无缝接入 npm，背靠广大开源社区。
如何快速创建及开发支付宝小程序：
1、开发者入驻
用企业支付宝账号登录蚂蚁金服开放平台 进入小程序公测首页申请小程序公测，审核时间为1个工作日。
2、获取小程序APPID
用企业支付宝账号登录开放平台进入开发者中心频道，点击左侧【小程序】菜单，可以看到已经创建的小程序列表，若未创建小程序，请先【创建小程序】，创建后可在【我的小程序】列表页看到对应的小程序APPID，该ID在上传版本时需要填写。
3、下载/登录 IDE
首先，请下载小程序开发 IDE 工具。它是一个辅助开发支付宝的小程序本地应用工具，包含本地调试、代码编辑、真机预览、发布等功能，覆盖了应用开发的完整流程。下载完成之后，打开它，打开手机上的支付宝应用，扫码确定即可登录。
4、项目创建
登录成功后你会看到以下界面。点击创建项目，选择文件夹即可完成新项目的创建。
5、代码编辑
打开项目，会默认进入代码编辑模式。从左到右，依次是文件操作区、代码编辑区和预览区。
代码编辑区可以对当前项目进行代码编写和文件的添加、删除以及重命名等基本操作。在代码编辑区修改任何代码都会重新编译，然后自动刷新应用。
工具针对 my 接口和 axml 提供了大量的自动补全提示，以帮助开发者提高效率。
6、示例代码
点击创建项目后会出现项目模版选择界面，选择 Hello World 模版项目做为初始项目，这个项目已经初始化了一些样例文件。
「技术」支付宝小程序开发笔记
最近开发支付宝小程序，记录一下遇到的坑
1 sjs只支持从sjs文件中导入模块，不能从其他js中引入。这个限制，只能在sjs里写一些小功能。
2 sjs不支持正则！sjs支持es6语法，这比微信小程序的wxs要进步一些。在 SJS 自定义脚本中不支持直接 new RegExp() 构造 regexp 对象，生成 regexp 对象需要使用 getRegExp 函数。例如：
3 下拉刷新开启，需要在app.json的window项 和页面的page.json 同事这种：pullRefresh:true
4 sjs中不能使用new 语法， new Date() 可以用 Date 替代
5 ref 有bug。 页面中多个子组件ref, 设置和提取不成功。
6 不能通过 import的方式导入本地图片等静态资源，只能通过写相对路径字符串的方式去调整图片的引用。
总结一下：
搞了一天的支付宝小程序。这些小程序做的呀，真的不知道该怎么说。为了安全，做一些限制可以理解。但是各家都自己搞一套非标准的东西，让我们这些开发人员真难受。这里面最典型的就是wxs/sjs。这种东西，就不应该出现。这东西太坑了。
MPX 开发(微信、支付宝、百度)小程序遇到的问题
不管是单个还是多个只要使用了具名插槽微信都无法显示，支付宝就没问题
在组件中开启
1、在支付宝中修改checked无效果问题，因为支付宝中默认是非受控
添加controlled属性
2、switch的change 事件问题，取值方式不同，百度使用e.detail.checked
二、支付宝小程序前端样式的设计.acss样式详解
在视频中已经说过了，小程序的设计思想和原生app的设计思想颇为相似，基本的应用单元为页面。当然对于一个页面来说每一个元素的放置位置在哪儿以及显示成什么样子这个是由 样式来决定的 。我们知道在web开发中样式是在css文件中规定的，叫做层叠样式表 (Cascading Style Sheets)。其实在APP中样式的约束也是使用css，在支付宝小程序中也是使用css不过文件的后缀是.acss而且对css3进行了扩充而已。
那么在支付宝小程序中的.acss和微信小程序中的.wxcss没有什么两样。 上边已经说了.acss其实包含了css3那么它还有一些新的特性是css3中不具备的，让我们一一看看
第一次看到这个东西也能猜到他是干什么用的。在css中我们知道规定大小一般使用像素(px)这个单位。比如显示生活中我们说房子128㎡那这儿的单位是平方米，在开发中需要更加精准的大小就是px像素。像素就非常精细了因为在我们显示屏幕中像素是最小的显示单元。这个道理如果不懂的话就找个LED屏幕仔细看，LED屏幕上一个一个的发光二极管可以想象为像素。
我们知道手机屏幕有大有小，就拿iPhone来说，iPhone 6 plus比iPhone 5要大。那么就说明plus的像素比5要多。对比：
加入有一个160px宽度的红色矩形在这两种手机中的位置如下：
rpx（responsive pixel）可以根据屏幕宽度进行自适应。如何自适应呢？看下边的分析：
看下图：
在模块化开发中我们有时候不得不在页面中使用其他的第三方库的样式，而第三方库的样式是保存在第三方包中的，我们不可能全部复制到我们的.acss文件中，那最好的办法就是导入了。在样式表中导入其他外联样式表。
当然仍旧支持内联样式和class属性制定样式类，如
选择器和css3的保持一致。一般有class=”test”类选择器和id=”test”的id选择器。当然在支付宝小程序的样式中特殊的地方就是：
※ .a- 或者 .am-为前缀的选择器已经被系统占用所以不要使用；
※ 不能使用属性选择器，例如,以下写法不被支持：
我之前说过小程序开发的应用单元为页面。其实我们在.axml中写的页面并不包含页面容器，就相当于我们做一个页面但是body标签不用写那如果我们要改变整个页面的背景怎么办呢?其实有一个固定的选择器。例如：
可以通过 page 元素选择器来设置页面容器的样式，比如页面背景色:
在你想改变页面容器的页面中定义该样式也可以，全局定义也可以，例如我想将test这个页面的页面容器背景设置为蓝色，就可以再pages目录下的test目录下找到test.acss在其中定义page的样式
下节是视图层讲解，如果有任何问题可以再下方给我留言或者发邮件到 weiyongqiang@weiyongqiang.com 我在收到邮件后会回复。
支付宝小程序怎么用 你用过吗
1、开发管理页面，点击去下载，下载小程序开发者工具。
2、选择操作系统与版本，下载安装完成后，打开小程序开发者工具，进入主界面点击“创建小程序”按钮。
3、开发者工具给我们提供了不少的小程序模板，我们可以先选择“todoApp示例”(类似微信开发者工具中小程序demo),然后点击下一步。
4、熟悉小程序demo，所以其他先默认就可以了，直接点“完成”按钮。
5、创建完成，进入小程序开发界面——可以看到，工具界面甚至代码结构都很类似。当然对于开发者来说，这挺好的，省去了好多学习成本了。
6、页面结构方面：除了命名略有不同之外，差别最大的也就是生命周期和部分组件了。
7、关于调试器：支付宝小程序开发者工具的调试器默认关闭，入口在底部做左侧，需点击按钮打开。
8、了解了这些，就可以很愉快的进入支付宝小程序开发了。如果学习能力比较强，去大致的了解下支付宝小程序开发文档就可以了，可以直接进入开发。如果没有做过微信小程序或学习能力较差的同学，建议还是认认真真的把小程序开发文档看一遍。
9、关于预览：支付宝小程序开发者工具的预览跟微信开发者工具还有些不同，可以按下面步骤操作。
记录一下支付宝小程序的坑
我们项目中 由于有个页面链接，没有形成闭环。不能从小程序其他页面跳转过去，只能上线之后通过apli的规格跳过去（卡包中跳转）。
如果前面打开过小程序，触发了onlauch事件，从卡包跳转的时候，只是进入这个页面，不会触发onlaunch事件了。
（其实这个没问题）
主要是开发过程中，我们要去找个页面就 开始通过 扫码 打开。 扫描打开页面都会重启小程序，并打开扫描的页面，都会触发onlaunch事件。
我这里出现的原因是： onlauch事件我会异步获取 userId保存到本地。 在活动页面由于上一期的种种问题，需要onload清空本地数据。
如果打开小程序在 活动页，那么 先触发onlaunch事件，异步获取userId（还没拿到）， onload清空本地数据， 这个是拿到了userId. 保存到本地。一切正常。
扫描开发和测试都没发现问题。（扫描活动页，会重新启动小程序）
上线后发现，有保存过小程序的用户，或者直接搜索小程序，进入了首页，触发了onlaunch事件， 异步获取并保存了userId到本地。。。然后从卡包进入活动页，清空本地数据，，，此时之后的流程就有问题了。
解决的办法：
关于支付宝小程序开发中总结和微信小程序开发总结的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。
