支付宝小程序前端开发简介

版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/fanxinzhi_FXZ/article/details/81392644

支付宝小程序前端开发简介

文件结构:

 App代表顶层应用,管理所有页面和全局数据,以及提供生命周期方法。它也是一个构造方法,生成App实例。一个小程序就是一个App实例。
 每个小程序的顶层一般包含三个文件:
    app.js:应用逻辑
    app.acss:应用样式(可选)
    app.json:应用配置

App 提供四个事件,可以设置钩子方法:
    onLaunch:小程序启动
    onShow:小程序切换到前台
    onHide:小程序切换到后台
    onError: 小程序出错

项目文件结构

基础事件

  • 点击事件onTap = ”method“ 传值:data-test=”123” 取值:method(event){ var test = event.target.dataset.test ; console.log(test) // 123 }
  • 列表渲染 a:for=”{{toyItems}}“ 指定下标变量名:a:for-index 指定当前元素变量名:a:for-item 如不指定元素变量名默认当前元素变量名为:item;下标变量默认为:index
  • 条件渲染 a:if=”{{true}}” hidden=”{{true}}” 是否渲染代码块:a:if=”{{true}}”//显示 是否显示代码块:hidden=”{{true}}” //不显示
  • data数据赋值 this.setData({
    toyItems : [ ] }) this.data.toyItems var toys = this.data.toyItems; console.log(toys.length) // 0
  • class根据需要修改样式 三目运算、布尔、算数运算、逻辑判断 class=”basics {{ true ? ‘select’ : ‘unselect’}}” basics 基础样式

开发过程中遇到一些坑

在支付宝小程序中的 my.httpRequest 请求头header中模拟cookie向后端传递用户信息时,在ios中请求没有问题,安卓部分机型出现cookie没有被成功传递的问题?

解决方法:   在请求 my.httpRequest 时把需要模拟cookie传递的参数拼接到接口请求时需要传递的默认参数中,当做参数传递过去,则需要后端需要调整一下接收用户信息参数的方式
展开阅读全文

没有更多推荐了,返回首页