Mini Program shopping cart

WeChat Mini Programs shopping cart
requests shopping cart data in the app.js, and this.carts = app.globalData.carts in the onLoad on the shopping cart page (cart.wxml).
on the shopping cart page, there are often operations to select, delete, and modify the quantity of an item:
if the first item is selected, modify the quantity of the second item:

this.data.carts[0].selected = true
this.data.carts[1].quantity = 6

send a request to save the modified shopping cart item to the background

wx.request("updateCart", data: {
  carts: this.data.carts
},
success: function() {
  // Q1
  // this.setData({carts:this.data.carts}) 
  // res.data
  // this.setData({carts:res.data})
  // Q2
  // carts"updateCart"
})
Feb.27,2021

A1:
1.app.globalData you have to think of it as the page page, the global default value of Mini Program, rather than the place where dynamic data is stored;
2. Mini Program's official idea is that the setData in page is only responsible for the current page and only binds the current page. Therefore, the bidirectional binding data of the current page is all setData;
3. Through the two-way binding mechanism, there is no need for DOM operation. You can use the data that exists in data as a data source (the real data part), wxml just renders the data. When you want to update or obtain, success gets the updated data, and then setData, wxml will also update Synchronize. Because the role of setData is to assign values to data + update wxml.

A2:
success is only the execution after the request is successful. If it is not successful:
1.request 's problem: error will be triggered.
2. The problem with the status code: there is no problem with request, but the current account status, parameters, data and other anomalies are generally identified by status codes such as code or errcode, which communicates with the backend. The setData is not executed if there is an exception.


Thank you for the invitation!
the process that individuals understand more strictly is as follows. For example, modify the quantity:
when the quantity input box blur event
this.data.carts [1] .oldQuantity = this.data.carts [1] .quantity

when input modifies in real time, the current value is passed to the background. If it succeeds, it will be skipped. If it is not successful, the current value will be set back to the Old value.

this is a real-time change step for the form.

it's pretty much the same if the entire form is submitted and modified, but it's handled when the form is submitted.

Menu