Can I use Random () to generate a unique id in vue for v-for:key?

scenario: add an item and set its id to a unique value
is pseudorandom generated by random appropriate? How do you operate?
(want to operate at the front end and can be used in the database)

Mar.05,2021

id needs to be unique, but it is best not to change it, otherwise it will lose the meaning of setting id. You will have a problem with random generation. The corresponding id of nodes in the old dom tree is different from that of the new dom tree, so the significance of setting id to improve performance does not exist, and there will be some other exceptions


.

random is a generated random number. There is a certain probability that multiple item will generate the same value, which is not guaranteed to be unique.

if you have ID in your business data, use ID directly, at least this is unique.


Don't directly key, something like Date.now (), then it loses the meaning of key. Imagine that a user moves a certain DOM node. If your key changes every time, then every pixel the user moves will re-create a DOM, instead of using the previous DOM to update the location. How much is this performance overhead?
it's best to keep the id in the page unique, such as relying on the id value of the background data, otherwise it's better not to give it at all.


if it is only a temporary unique identity used in the front end, you can use the timestamp (new Date ()). ValueOf as a temporary key, upload server to regenerate it to uuid. Or it can be directly generated by the library generated by the front-end uuid and saved directly by the server.


make sure the generated number is unique , and the method is random


wrong. Generating id for item should not be left to the front end. This should be left to the back end. Then you can use the returned id as key. Do not generate id


(item,index) in list,:key = index at the front end. You don't know the hidden dangers of using array index as key


let id = 0;

function GetId() {
    return PPid;
}

generate uuid with faker library

Menu