ITPub博客

首页 > 移动开发 > HTML5 > 小程序基础

小程序基础

原创 HTML5 作者:20170405 时间:2020-08-29 15:19:03 0 删除 编辑

  小程序和普通网页开发的区别

  1.网页开发渲染线程和脚本线程是一个进程。而小程序是分开的,分别运行在不同的线程。

  2.网页开发可以操作DOM和BOM,小程序缺少DOM和BOM的方法。

  3.小程序的运行环境与nodejs环境也不相同,所以一些npm的包在小程序中无法运行。

  4.从小程序基础版本2.2.1开始支持npm安装第三方包。

  小程序的开发流程

  1.注册小程序账号

  获取AppID,官网注册即可

  通过微信公众号注册,条件是已有微信公众号并且是企业级,个人不可以。优点是如果公众号已经认证过了,小程序不需要再次认证,省去了认证的时间和费用

  2.安装最新版开发工具

  3.开发/测试/上传代码(上传到微信服务器)

  4.提交审核

  5.发布上线,发布小程序之后,我们可以在微信中搜索到我们开发的小程序。

  6.错误查询/性能监控 登录官网-开发-运维中心

  wxss

  1.小程序的尺寸单位rpx,可以根据屏幕宽度进行自适应,规定屏幕宽度750rpx。在iphone6上,屏幕宽度为375px

  2.定义在app.wxss中的样式为全局样式,它会被注入到每个小程序的每个页面。在page的wxss文件中定义的样式为局部样式,只作用在对应页面,并且会覆盖app.xss中相同的配置

  3.样式导入@import‘./test.wxss’

  4.选择器,.class,#id,element,::after,::before,view >image,

  5.widthFix:缩放模式,宽度不变,高度自动变化,保持原图宽高比不变

  6.设置背景颜色需要在page{background:#ddd}

  事件对象

  1.事件对象可携带额外信息,id,dataset

  data-info="{{avatarUrl}}"

  2.事件分类:冒泡,非冒泡

  3.事件绑定:事件绑定的写法同组件的属性,key-value。Key以bind和catch开头,然后跟上事件的类型,bindtap,catchtap(bind事件绑定不会阻止冒泡事件向上冒泡,catch事件绑定可以阻止冒泡事件向上冒泡)

  4.事件对象—type代表事件的类型,timeStamp页面打开到触发事件所经过的毫秒数,target触发事件的源组件,currentTarget事件绑定的当前组件(id事件源组件的id,tagName当前组件的类型,dataset事件源组件上有data-开头的自定义属性组成的集合)

  5.以data-开头,多个单词有连字符链接,不能有大写(data-element-type会转为elementType)

  页面跳转

  1.wx.switchTab 跳转到tabBar页面,并关闭其他所有的tabBar页面

  2.wx.navigate保留当前页面,跳转到应用内的某个页面。

  3.wx.navigateBack返回原页面

  页面的生命周期

  onLoad 监听页面加载 (只在页面初始化时加载一次)

  onShow监听页面显示(每次显示页面都会执行)可以多次执行

  onReady监听页面初始渲染完成

  onHide 监听页面隐藏

  onUnload 监听页面 卸载

  转发

  只有在页面js监听了onShareAppMesage事件处理函数,右上角菜单才会显示“转发”

  自定义转发内容

  只需要在事件处理函数中return一个对象,实例如下

  onShareAppMessage: function () {

  return {

  title:‘自定义转发标题’,

  path:’/pages/user?id=123’,

  imageUrl:’’

  }

  }

  默认转发内容:如果我们没有在事件处理函数中return一个对象,小程序会默认吧当前页面的标题路径一级页面截图返回


来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/69979119/viewspace-2715700/,如需转载,请注明出处,否则将追究法律责任。

上一篇: for循环的概念
请登录后发表评论 登录
全部评论

注册时间:2020-07-14

  • 博文量
    61
  • 访问量
    27126