Analysis of problems with data copying in mini programs

The content of this article is about the analysis of data copy problems in small programs. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Recently, I helped my colleagues create a multi-product review page. Multi-product, as the name suggests, is a lot of products. Each product has a star rating, uploaded picture information and review content,

because there were originally I have written the function of public account, so I volunteered to write multi-product reviews for mini programs, but I fell into a trap...

The idea is very simple. First create one An array of stars. A five-star review is a picture of five stars, as follows:

starList: [{
       srca: "img/star02@3x.png",
       index: "1"
       }, {
       srca: "img/star02@3x.png",
       index: "2"
       }, {
       srca: "img/star02@3x.png",
       index: "3"
       }, {
       srca: "img/star02@3x.png",
       index: "4"
       }, {
       srca: "img/star02@3x.png",
       index: "5"
       }],

I am too lazy to remove the subscript and directly use index to represent the rating, and then define a new array pductList based on the product list array returned by the background to loop and define variables. starLista is assigned an array

for(var i = 0; i < response.commoditys.length; i++) {
               response.commoditys[i].starLista = starList;
  }

The same operation is performed for a list with multiple pictures uploaded at the same time, and then binds the click event to the looped star to get its subscript and index to judge the loop under each product Dynamically change the star array src

  for(var i = 0; i < app.dataList[index].starList.length; i++)
   {
     app.dataList[index].starList[i].srca = "img/star02@3x.png";
     evaluateList[index].mark = idx + 1;
     if(i <= idx)
      {
        app.dataList[index].starList[i].srca = "img/star01@3x.png";
       }
       evaluateList[index].mark = idx + 1;
       evaluateList[index].commodityid = cId;
 }

Finally take productList The values ​​you need are basically all in this array,

--------------- --------------------------------------------------Falling into a trap- --------------------------------------------------

I started writing a small program and kept writing along this line of thinking. However, halfway through writing, I suddenly discovered that I clicked on a row of small stars, and the colors of all the stars would change. After going through troubleshooting, scratching my head and sitting on a pincushion, looking around. , finally found that

in the defined new array productList changes starLista according to the subscript The original array starList of the little stars, initially The defined array will also change accordingly

After going through Baidu Google csdn blog park and so on, I finally thought of a plan to convert the original star array starList into a string format first , when assigning values ​​to the defined new array pductList, the problem was finally solved when converting it to json format

let starListc=JSON.stringify(starList);
for(let i = 0; i < response.commoditys.length; i++) {
               response.commoditys[i].starLista = JSON.parse(starListc);
  }

. It should be related to the deep copy of the data of the applet. This is how to handle the changes. It should be a string without changing the original array. I have also considered creating an array to assign values, but this method is not simple and crude. I have made this mistake all morning. I would like to post this as a souvenir and to alert myself. . . . . . . . . . . . . . . .

Related recommendations:

Backup and copy MYSQL database_MySQL

javascript’s detailed explanation of shallow copy and deep copy

The above is the detailed content of Analysis of problems with data copying in mini programs. For more information, please follow other related articles on the PHP Chinese website!