preface

For the postgraduate entrance examination question brushing applet project, its technology stack is based on wechat native applet and cloud development capability. Therefore, it is necessary to install wechat developer tools locally, initialize the postgraduate entrance examination question brushing applet project, understand the project directory structure and configuration files, and understand and learn relevant framework knowledge, which will be of great help to learn or directly use this project.

1. Life cycle

It's just an event!! It will only be triggered automatically at a specific time.

There are two types:

1. Application lifecycle app js；
2. Page life cycle;

A wechat applet project is actually an application, which can have multiple pages.

1.1. Application life cycle

Take a look at the app in the postgraduate entrance examination question brushing applet project js

App({

  // The applet is triggered at startup 
  onLaunch: function (options) {
    // When the application starts, you can get some information about the user 
    console.log("onLaunch");
  },

  // Triggered when the applet is displayed 
  // Repeatedly triggered 
  onShow: function (options) {
    console.log("onShow");
  },

  // Triggered when the applet is hidden
  onHide: function () {
    console.log("onHide");
  },

  // Triggered when an application error occurs
  // Error messages are captured here 
  // Collect error information - send ajax asynchronous request to the background 
  onError: function (msg) {
    // msg: error message
    console.log("onError");
    console.log(msg);
  },

  // It will be triggered when the page cannot be found 
  onPageNotFound: function (options) {

  },

  // Applied global data
  globalData: {
    title:"life cycle"
  }
});

1.2 page life cycle

Take a look at the home page of the postgraduate entrance examination question brushing applet project index js

Page({
  data: {
    
  },
  
  // Triggered when the page starts loading 
  // Send an asynchronous request to get data to render the page  
  onLoad: function(options) {
    console.log("onLoad");
  },

  // Triggered when the page labels are rendered 
  onReady: function() {
    console.log("onReady");
  },

  // Page is displayed page switching - Page routing 
  onShow: function() {
    console.log("onShow");
  },

  // The page is hidden
  onHide: function() {
    console.log("onHide");
  },

  // When a page is unloaded - when a different open type is used during page switching, the current page will be closed
  onUnload: function() {
    // Some scheduled tasks can be closed 
    console.log("onUnload");
  },

  // Triggered when the page is pulled down and refreshed 
  // Manually enable drop-down refresh in global configuration or page configuration!!!
  onPullDownRefresh: function() {
    console.log("onPullDownRefresh");
  },

  // Pull up page to load the data of the next page
  onReachBottom: function() {
    console.log("onReachBottom");
  },

  // When the page is forwarded  
  onShareAppMessage: function() {
    console.log("onShareAppMessage");
  },

  // When the page is scrolled  
  onPageScroll: function() {
    console.log("onPageScroll");
  },
  
  // Triggered when tabbar is clicked 
  onTabItemTap:function(item) {

  }
});

2. Native component

Common native components in the postgraduate entrance examination question brushing applet:

2.1,view

View containers, that is, block level elements.

2.2,text

Text labels, that is, inline elements.

1) Only text nesting is supported within the text component.

2) Set the user select attribute. Long press the text to select and copy.

3) Spaces and carriage returns can be parsed and displayed.

2.3,image

1) Default width and default height 320 * 240.

2) Built in lazy load.

3) Mode render mode:

scaleToFill: default. Stretch the picture content to the size of the frame.
widthFix: turns the image into the same rendering mode as the image in the previous web. Web images, when the width changes, the height will change proportionally. Mobile terminal development img width:100%.
aspectFit: stretching the picture content to an equal scale may cause the image frame to be left blank.
aspectFill: stretch the picture content in equal proportion, and the picture content will be intercepted (the picture content will fill the picture frame).

2.4,button

Button

2.5,radio

Single choice items are used for single choice questions in the small program item of brushing questions for postgraduate entrance examination.

2.6,checkbox

If you select multiple items, the attributes are roughly the same as the radio. It is used for multiple-choice questions in the small program project of brushing questions for postgraduate entrance examination.