在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ 關(guān)于react列表渲染的疑問(wèn),跪求解答!

關(guān)于react列表渲染的疑問(wèn),跪求解答!

文檔以及很多博客都提到key用于列表元素項(xiàng)的復(fù)用,在虛擬dom元素進(jìn)行對(duì)比的時(shí)候會(huì)用到這個(gè)key,以下兩種方式有什么區(qū)別?
方式1:

const arr = [<li>{numbers[0]}</li>,<li>{numbers[0]}</li>,<li>{numbers[1]}</li>]
return (
    <ul>{arr}</ul>
);

以上會(huì)報(bào)錯(cuò):

Warning: Each child in an array or iterator should have a unique 'key' prop.

方式2:

return (
    <ul>
      <li>{numbers[0]}</li>
      <li>{numbers[0]}</li>
      <li>{numbers[1]}</li> 
    </ul>
  );

運(yùn)行不會(huì)報(bào)錯(cuò)。

問(wèn)題:以上兩種方式創(chuàng)建出來(lái)的虛擬dom不是一樣的嗎?為什么后者不會(huì)報(bào)key錯(cuò)呢?

回答
編輯回答
喵小咪

因?yàn)榈诙N方式里li是固定的,第一種方式對(duì)react來(lái)說(shuō)li是動(dòng)態(tài)的,通過(guò)for循環(huán)創(chuàng)建的

2018年6月30日 14:16