Home >Web Front-end >uni-app >uniapp modifies array value

uniapp modifies array value

王林
王林Original
2023-05-22 09:10:072533browse

Recently, in the process of developing small programs using uniapp, I encountered a problem: how to modify the array value. As a beginner, I didn't read the documentation carefully, so I initially used the native js method to modify the array, but found that it was not successful. So I started looking for a solution.

After consulting official documents and some developers’ experience sharing, I learned that uniapp has its own set of methods for modifying array values. Below I will share with you based on my development experience.

First of all, we need to clarify a concept: arrays in uniapp are not exactly the same as native arrays. Uniapp's arrays are responsive, which means that when the array changes, the corresponding UI will automatically update. Therefore, when modifying the uniapp array, we need to use the special methods provided by the framework instead of using the native methods.

The following are several common methods to modify the uniapp array:

  1. push() method: This method can add one or more elements to the end of the array and return the modified Array length.
this.array.push(newElement1,newElement2,....);
  1. pop() method: This method can delete and return the elements at the end of the array.
this.array.pop();
  1. shift() method: This method can delete and return the elements at the head of the array.
this.array.shift();
  1. unshift() method: This method can add one or more elements to the head of the array and return the modified array length.
this.array.unshift(newElement1,newElement2,....);
  1. splice() method: This method can delete one or more elements in the array and insert elements at the specified position.
this.array.splice(start[, deleteCount, item1, item2, ...]);

Among them, start represents the starting position of deletion/insertion, deleteCount represents the number of elements to be deleted, item1, item2, etc. represent the elements to be inserted.

Since uniapp's array is responsive, if we directly modify an element of the array, the UI will not automatically update. Therefore, we need to use the $set method provided by uniapp to modify an element in the array:

this.$set(this.array, index, newValue);

Among them, this.array represents the array to be modified, index represents the subscript of the element to be modified, and newValue represents the new value.

The above are the common methods of modifying arrays in uniapp. Of course, there are many other methods, which you can view in the official documentation.

In summary, if you want to modify the uniapp array correctly, you need to use the responsive method provided by the framework, and you cannot directly use the native method. I understand this truth through my own development experience, and I hope to help more beginners.

The above is the detailed content of uniapp modifies array value. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn