This is the 9th day of my participation in the August More Text Challenge

Some common data storage methods in small programs are discussed

Global variable globalData

When the applet was originally created, the globalData parameter was added by default to the object passed in the app method in the app.js file. In all pages we can retrieve the globalData from the object passed in by the App method using the getApp method.

const App = getApp();
const openId = App.globalData.openId;
App.globalData.openId = 1;
delete App.globalData.openId;
Copy the code

The globalData value is an object that can be called in the same way as an object. (That’s not necessarily globalData’s name)

Page private variable data

The JS logical layer Page of each Page is passed an object in the Page method. The value of data is generally used to store variable values in the current page. Its primary purpose is to change the WXML view layer to display content through data interaction with the view layer through the setData interface.

If you do not need to pass values from data into the view layer, it is not recommended to use setData and operate in object mode instead. It can save performance.

When the page is initialized, the data in data interacts with the view layer. If you go further, you can also add localData to the object specifically to store variables needed for the current page

Page({
	data: {
		openId: 123
	},
	localData: {
		timeStamp: Date.now()
	}
})
this.setData({
	openId: 321
})
this.data.openId = 321;
this.localData.timeStamp = Data.now();
Copy the code

storage

Storage is also a common storage method in applets, similar to the global variable globalData. Not limited to a page, values can be obtained anywhere through the interface provided by WX.

The advantage is that it can be stored for a long time. Even if you log out and re-log in, the data will not disappear. (Maximum storage capacity: 10M)

Disadvantages: asynchronous behavior, each access time is relatively long.

Wx provides a set interface for adding, deleting, modifying, and querying data.

Asynchronous storage (depending on device performance, you really don’t know how long it will last)

wx.setStorage({
	key: 'key'.data: 'value'.success: res= >{... }})/ / support promise
wx.setStorage({key: 'key'.data: 'value'})
	.then(res= >{... })Copy the code

Synchronize storage (blocking ~)

wx.setStorageSync('key'.'value')...Copy the code

File storage fileSysteManager

FileSysteManager (FS for short) stores text and image data as files to the local PC. Storage upper limit of 10M, long-term storage, do not delete small program data will not disappear.

Writing:

const fs = wx.getFileSystemManager();
fs.writeFile({
  filePath: `${wx.env.USER_DATA_PATH}/_l${fileName}.txt`.data: JSON.stringify(data),
  encoding: 'utf8'.success(res){... }})Copy the code

Env. userDatapath in filePath is the default space wX assigns to the current program. Coder can create folders, add files, and so on.

FileName is the fileName for storing data.

Data is the data to be stored. It can be a picture.

Encoding: Encoding format, which can be set to binary if data is a picture.

read

Remember the file name and storage location when accessing data;

fs.readFile({
  filePath: `${wx.env.USER_DATA_PATH}/_l${fileName}.txt`.encoding: 'utf8'.position: 0.success(res) {
	JSON.parse(res.data) 
  }
})
Copy the code

remove

fs.unlink({
  filePath: `${wx.env.USER_DATA_PATH}/_l${fileName}.txt`.encoding: 'utf8'.success(res){... }})Copy the code

Fs operations are asynchronous, so pay attention to the processing logic.