鍍金池/ 問(wèn)答/HTML/ react 中 React.Children.map 為什么會(huì)重繪

react 中 React.Children.map 為什么會(huì)重繪

代碼如下,為什么在currentItem.isLeaf 變化時(shí),整個(gè)組件(包括子組件)都會(huì)發(fā)生重新mount

return React.Children.map([0,1,2,3,4,5,6], (Child, index) => {
      const ChildNode = currentItem.isLeaf === '1' ?
        AComponent :
        BComponent;

      return React.createElement(ChildNode,
        {
          amount: 5,
          index,
          key: `level-${index}`,
        }
      )
    })
回答
編輯回答
玄鳥(niǎo)

答案是type不同了

React.createElement的函數(shù)簽名是 React.createElement(type, props, children)。

React在做dom diff時(shí)候,首先判斷的就是type,如果type不一致就會(huì)重新渲染(remove然后append)。

題主currentItem.isLeaf 變化時(shí),對(duì)應(yīng)的正好就是type發(fā)生變化,因此會(huì)重新渲染。

2017年3月1日 12:49