Project Summary II: The processing of numbers in the APP's Little Red dots

Little Red Dot, is the most common feature of the APP, we first look at the following case, in, to evaluate the product has 2, click on the " Evaluation of the Sun list "After the button has been evaluated, then the quantity to be evaluated should be 1, so how does this function be implemented?"

In general, there are three ways to achieve this:

First, refresh the entire page of data

That is, every time it is displayed, the data is pulled back from the server, which is simple, but it increases the load on the server, and because of the full page refresh, the user experience is not good.

Second, the use of events to achieve

For example: Add an event called the evaluation of the Sun, the Personal center page to listen to the event, while the user to evaluate the operation, the server returns the number to be evaluated, and then the client triggers the event, and the value passed past.

This can be done well, though. But a little annoying, to define events, to listen for events, and to trigger events.

Third, use global variables

Using a variable called "number to evaluate", when evaluated, the data returned by the server (the number to be evaluated) is written directly to the variable. This is the method used in this project. Simple and easy to use, there seems to be no side effects.

Four, the key code

var model = {        notPaidCount:account.orderInfo.notPaidCount,        toreceivecount: Account.orderInfo.toReceiveCount,        EvaluateCount:account.orderInfo.evaluateCount,        nickname: Member.currentUserInfo.NickName,}
Page.viewChanged.add (() = Ko.applybindings (model, Page.nodes (). content));

The above code defines a model and binds the model to the node of the page. The Evaluatecount is the number to be evaluated, which is a global variable. The following code is called the service side of the service, after completion, the service side returned to evaluate the number of directly written to the global variable.

Services.callmethod (SITE.CONFIG.SERVICEURL, ' product/evaluateproduct ', data). Done ((value) + =            {  This . Orderinfo.evaluatecount (value);        })

Wu, extrapolate

In fact, there are a lot of places that need local refresh, you can consider using this method. For example: Users upload the head image, modify the name, the number of items in the shopping cart and so on.

Vi. Project Code

Complete project code hosted on GitHub, Https://github.com/ansiboy/ChiTuStore

Project Summary II: The processing of numbers in the APP's Little Red dots