在vue中生成唯一id用于v-for:key 可以用Random()产生吗?
*场景:添加一个item 并将其的id设为唯一值*
通过random产生的伪随机适合吗?你们是通过什么方式操作?
-
会导致其下组件多次渲染,增加性能开销
-
random
是生成随机数,有一定概率多个item
会生成相同的值,不能保证唯一。
像你这业务数据里有 ID
的话,就直接用 ID
吧,至少这个是唯一的。
id需要唯一,但是最好不变动,否则失去了设置id的意义,你用random生成会有一个问题,老的dom树和新dom树中节点对应的id是不一样的,这样设置id提高性能的意义就不存在了,而且会出现一些其他异常
千万不能直接给类似Date.now()的做key,那就失去了key的意义,试想一下,用户移动某个DOM节点,如果你的key是每次变化的,那用户每移动一像素都会重新创建一个DOM,而不是拿以前的DOM去更新位置,这性能开销有多大?
最好还是能保持页内的id唯一,比如依赖后台数据的id值,否则还不如不给。
如果只是临时的 在前端使用的唯一性标识,可以用时间戳 (new Date()).valueOf 当做临时key,上传服务端保存时再生成uuid就好。或者也可以直接由前端的uuid生成的库直接生成,服务端直接保存。
确保生成的数唯一性
,至于方法随意
思路错误了。给item生成id这种事情不应该交给前端来做。这个事情应该交给后端。然后你再用返回的id作为key就好了。不要在前端来生成id
(item,index) in list,:key = index ,不知道使用数组的index作为key有什么隐患没
let id = 0;function GetId() { return ++id;}
用faker库生成uuid