We used four articles to introduce the meaning of the first two sentences of the medical beauty applet. Today, we return to the theme of the program and continue to interpret the official template
Global lifecycle function
The life cycle function is different from the global function and the page function. The global function is to load the applet as soon as it is started, and the page is executed when it needs to open a specific page. Let's first look at the global lifecycle function of the official template
import WXStorage from './common/storage' import isUserExist from './common/getUserInfo' export default { async onAppLaunch(launchOpts) { const [shopInfo] = await Promise.all([getShop()]); console.log(shopInfo) app.dataset.state.shopInfo = shopInfo; }, onAppShow(appShowOpts) { //console.log('---------> LifeCycle onAppShow', appShowOpts) }, onAppHide() { //console.log('---------> LifeCycle onAppHide') }, onAppError(options) { //console.log('---------> LifeCycle onAppError', options) }, onAppPageNotFound(options) { //console.log('---------> LifeCycle onAppPageNotFound', options) }, onAppUnhandledRejection(options) { //console.log('---------> LifeCycle onAppUnhandledRejection', options) } } async function getShop() { const ret = await app.dataSources['businessBeauty'].getShop() if (ret.code != 0) { return app.showToast({ title: 'Failed to get store information' }); } return ret?.data || [] }
The code means to obtain a specific information of the store when the applet starts, and initialize the obtained information into the global variable. Two knowledge points are involved here, deconstruction assignment and Promise
Destructuring assignment
We usually assign values to variables through the = sign operator, usually a single variable. Deconstruction assignment can assign values to multiple variables. Common deconstructions include object deconstruction and array deconstruction
const [shopInfo] = await Promise.all([getShop()]);
const [shopInfo] is to deconstruct the array and deconstruct the values in the right array into shopInfo
Promise
Promise allows you to construct an asynchronous function for execution, which can be understood as a method to call an asynchronous function
Promise.all can call multiple asynchronous functions at one time and receive an array as parameters. If there are multiple asynchronous functions, the function names are separated by commas
Get store information
What is the specific method to obtain store information?
const ret = await app.dataSources['businessBeauty'].getShop()
The execution of this sentence is to obtain the store information and call the getShop method of the businessBeauty data source. We can open the data source management to view the specific code
const { LcapContainer } = require('@cloudbase/lcap-business-sdk'); const SHOP_CONFIG_KEY = 'shopInfo'; const SHOP_CONFIG_DEFAULT = { name: 'Default store', logo: 'https://tva1.sinaimg.cn/large/008i3skNgy1gspycq9ge5j305k05kjr7.jpg', telphones: [], workTime: { week1: { start: 480, end: 1020 }, week2: { start: 480, end: 1020 }, week3: { start: 480, end: 1020 }, week4: { start: 480, end: 1020 }, week5: { start: 480, end: 1020 }, }, location: { province: '', city: '', district: '', address: '', }, }; /** * Query store information */ async function main(params, context) { const { services } = new LcapContainer({ lcDatasourceCtx: context }); const { tcbService: { db }, utilService, configService } = services; // Query store information const shopCol = db.collection('lcap-beauty-config'); const shopRes = await shopCol.where({ key: SHOP_CONFIG_KEY }).get(); if (utilService.isValidArray(shopRes.data)) { return shopRes.data[0].value; } const createTime = utilService.getLocalDayjs().valueOf(); await shopCol.add({ key: SHOP_CONFIG_KEY, value: SHOP_CONFIG_DEFAULT, createTime, updateTime: createTime, }); return SHOP_CONFIG_DEFAULT; } /** * Local test logic */ if ((new LcapContainer()).services.configService.isLocalDev()) { main().then((res) => { console.log('>>> res is', res); }); } module.exports = main;
The first sentence of this method is object deconstruction syntax
const { LcapContainer } = require('@cloudbase/lcap-business-sdk');
require
We are not particularly clear about the require in the getShop cloud function, so I Baidu it specially What is require
After reading the official explanation, it is actually used to introduce other modules. After the introduction, you can directly call the variables and methods defined inside
Definition of constants
There is also a const keyword, which defines constants. Constants are generally named in uppercase
Business logic
Because a third-party SDK is introduced, it is not clear what the SDK is used for. As an official, it has constructed a database to store this information, but it needs to be used through the SDK. In fact, in our daily development, we use self built data sources, and then compile cloud functions to interact with the database and provide external methods for normal page calls.
summary
In this section, we combed the code of how to load store information in the global life cycle. Of course, some of them we don't know what to do, and don't worry too much. We just increase our knowledge through continuous combing, and we can't understand them all at once. Constantly absorb the construction ideas and schemes of the official template. When you do it yourself, you will have a reference method, which is also the greatest value of learning the official template.