乐趣区

关于javascript:考研刷题小程序云开发实战基础知识储备2

jiezi

前言

考研刷题小程序我的项目，它的技术栈基于微信原生小程序和云开发能力，所以须要在本地装置微信开发者工具，初始化考研刷题小程序我的项目，意识我的项目目录构造与配置文件，以及理解和学习相干框架常识，这样会对学习或者间接应用本我的项目均有很大的帮忙。

1、生命周期

只是一个事件而已！！只是会在特定的时候，会主动触发。

分为两种：

  1. 利用的生命周期 app.js；
  2. 页面的生命周期；

一个微信小程序我的项目其实一个 利用 ，一个利用外面能够领有多个 页面。

1.1、利用的生命周期

看看考研刷题小程序我的项目中的 app.js

App({

  // 小程序在启动的时候  触发 
  onLaunch: function (options) {
    // 当利用开始启动的时候，能够获取用户的一些信息 
    console.log("onLaunch");
  },

  // 小程序被展现 的时候触发 
  // 重复被触发 
  onShow: function (options) {console.log("onShow");
  },

  // 小程序被暗藏的时候触发
  onHide: function () {console.log("onHide");
  },

  // 当利用出错了时候会 触发
  // 在这里 捕捉错误信息 
  // 把错误信息收集 -  发送 ajax 异步申请 发送到后盾中 
  onError: function (msg) {
    // msg：错误信息
    console.log("onError");
    console.log(msg);
  },

  // 当页面找不到了 就会触发了 
  onPageNotFound: function (options) { },

  // 利用的全局数据
  globalData: {title:"生命周期"}
});

1.2、页面的生命周期

看看考研刷题小程序我的项目中的首页 index.js

Page({data: {},
  
  // 页面开始加载的时候触发 
  // 发送异步申请 获取数据来渲染页面  
  onLoad: function(options) {console.log("onLoad");
  },

  // 页面标签都渲染结束 才触发 
  onReady: function() {console.log("onReady");
  },

  // 页面被 显示  页面切换 - 页面路由 
  onShow: function() {console.log("onShow");
  },

  // 页面被暗藏
  onHide: function() {console.log("onHide");
  },

  // 页面被 卸载的时候 -  当页面切换的时候 应用了不同的 open-type 会敞开以后页面的
  onUnload: function() {
    // 能够敞开一些定时工作 
    console.log("onUnload");
  },

  // 当页面 下拉刷新的时候触发 
  // 在全局配置或者 页面配置中 手动开启 下拉刷新！！！onPullDownRefresh: function() {console.log("onPullDownRefresh");
  },

  // 上拉页面  上拉加载下一页数据
  onReachBottom: function() {console.log("onReachBottom");
  },

  // 当页面被转发的时候  
  onShareAppMessage: function() {console.log("onShareAppMessage");
  },

  // 页面被滚动的时候  
  onPageScroll: function() {console.log("onPageScroll");
  },
  
  // 当点击 tabbar 的时候触发 
  onTabItemTap:function(item) {}});

2、原生组件

在考研刷题小程序中，罕用的原生组件：

2.1、view

视图容器，也就是块级元素。

2.2、text

文本标签，也就是行内元素。

1）text 组件内只反对 text 嵌套。

2）设置 user-select 属性，长按文本可选、复制。

3）能够对空格、回车进行解析显示。

2.3、image

1）默认的宽度和默认的高度 320 * 240。

2）内置懒加载 lazy-load。

3）mode 渲染模式：

scaleToFill：默认值。把图片内容，拉伸到相框的大小。
widthFix：把图片变成了和以前 web 中的图片的渲染模式一样。web 图片，当宽度扭转的时候，高度会等比例的跟着扭转。挪动端开发 img width:100%。
aspectFit：等比例拉伸图片 - 内容，可能会导致，image 相框留出空白。
aspectFill：等比例拉伸图片 - 内容，图片的内容会被截取（图片内容会撑满相框）。

2.4、button

按钮

2.5、radio

单选我的项目，在考研刷题小程序我的项目中用于单项选择题。

2.6、checkbox

多选我的项目，属性和单选 radio 大略统一。在考研刷题小程序我的项目中用于多项选择题。

退出移动版