The first three chapters are interface design, which describe how to build the front page, answer page, and answer score page of the answer subroutine.
Now we have entered the functional interaction chapter, which is the third chapter of the functional interaction chapter, how to use cloud development to realize the query question bank function.
In essence, this is equivalent to sending asynchronous requests in a forward-to-back architecture. First look at the official document how to say, and then look at how I understand and how to do, I hope you can get inspiration, and then find their own learning methods.
Software architecture: wechat native small program + cloud development
Poke source code address, get source code, version continuous iteration…
Preparatory work
As usual, let’s see what the official documents say. You don’t have to read through the document, you can follow the “search for what you need” principle. There should be emojis here, squid xi “read the document”.jpg
What is cloud development and what are the capabilities of cloud development
What is the database, how to call the small program, is so said, blah blah blah ~
Well, if you’re interested, you can read the rest.
No blow no black, after all, wechat small program development official documents, is the most detailed description of the official technical documents I have seen.
Of course, there are a few things that I would like to mention in more detail.
Unwritten analysis
Cloud development capabilities, including cloud databases, cloud storage, cloud functions, cloud calls and so on. It is multifarious, so many concepts, dazzling, dizzy so it.
In fact, may not need, some may not use. You can use it in combination or just one or the other, and it’s all in the eye of the beholder. Here, we use the small program side SDK of the cloud database.
If you want to develop a complete answer applets project for free and quickly, cloud applets development may be the best choice. Small program cloud development is mainly used in front of the development of knowledge, yes, you heard right read wrong, underline it.
From now on, get rid of the shadow of “front-end little brother little sister”, “back-end little brother little sister”, you can be tough, the whole project a shuttle, solo~
Cloud development quick query question bank
As the saying goes, “Before the troops and horses move, food and grass should come first.” To invoke a database, you need a database first. This sentence looks like nonsense, but it is actually a metaphor for a series of operations.
Three questions of the soul:
Have you signed up for a cloud development service?
Have you created the database collection?
Did you add the question data?
No? ! No? ! No? !
Who else
1, hand to hand teach you to operate the database
1) Click the cloud development icon of wechat developer tool to open the cloud development console.
2) Click the database icon to enter the database management page, click the + icon on the right of the collection name, you can create a data set.
3) Here we only need to add a set of ActivityQuestions, which is used to store the question bank.
4) Add question data, or import question bank, either way.
① Add records, one by one manually add, one by one……
② Import question bank, whoosh directly into the prepared question bank JSON file.
5) Big tea oh, no. Big guy, remember to set data permissions. Otherwise, it defaults to “creator only read/write” and then fails to find the data. Don’t run. You still have bugs to fix
2. Database design of question bank
You can clearly see that a question corresponds to a record. You can roughly think of it as records in a collection, like objects in an array.
For every problem you create, it automatically generates an ID field, so you don’t have to worry about that. The fields included in a question are nothing more than question, option, true and Checked.
Field interpretation:
1) The question is dry
2) option
3) True
4) Checked whether the question has been done
3, small program side call database
To call the database on the applet side, we can write the following code to an event handler and execute it directly in the page lifecycle function.
In fact, summed up, there are three steps:
1) First use wx.cloud.database() to get a reference to the database(equivalent to connecting to the database);
2) Use db.collection() to retrieve a reference to the collection;
3) Use collection. get to get the records in the Collection.
Line by line interpretation of project code:
// Connect to cloud database const db = wx.cloud.database(); Const activityQuestion = db.collection('activityQuestion'); // Get a reference to the collection const activityQuestion = db.collection('activityQuestion'); // database operator const _ = db.mand; QuestionList: [], // list of questions index: 0 // list of questions index: 0}, /** * lifecycle function -- listen to the Page load */ onLoad: Function (options) {this.getQuestionList()}, GetQuestionList () {// Display loading prompt wx.showloading ({title: 'loading'}); ActivityQuestion. Where ({// specify a query condition, return a new set reference with a new query condition true: _.exists(true)}).get().then(res => {// Obtain set data, or obtain set data filtered according to query conditions. The console. The log (' [cloud database] [activityQuestion] query success ') console. The log (res) data) let data = res. Data | | []; This.setdata ({questionList:data, index: 0}); // Send data from the logical layer to the view layer. // hideLoading prompt wx.hideloading (); })}})Copy the code4. Query results of question bank
After saving and waiting for the code to compile, click the “Start answering” button to jump to the answering page and you can see the 20 database records called on the console.
As a slight note, if limit is not specified, a maximum of 20 records are taken by default.
