重新呈現DOM的陣營

我使用一些CSS動畫在我的應用程序做出反應，但我有，只有一些節點動畫，因爲剩下的沒有被重新描繪的問題，而是在渲染功能被回收。因此，他們不按預期顯示CSS動畫。有什麼辦法可以強制React重新渲染節點而不是重複使用它們？重新呈現DOM的陣營

2015-10-02 Ruben Martinez Jr.

CSS動畫不應該依賴渲染節點。但是，如果你的情況需要它，那麼你可以使用'this.forceUpdate（）;'重新渲染組件。 – zvona

我使用的CSS動畫只有迭代計數爲1，即它只發生在首次將節點加載到DOM中。在整個渲染過程中，React似乎重用了節點，因此動畫不會再運行。我會嘗試'this.forceUpdate（）'！ –

CSS動畫取決於在課堂上或風格的變化。爲了讓動畫發生，你需要改變其中的任何一個，這會強制反應重新渲染。所以我不希望this.forceUpdate()有所作爲。

在列表中，反應再使用的部件（例如，如果你重新排序列表中的項目）。例如。如果你有一個清單：

<li>1. Cat</li> 
<li>2. Mouse</li> 
<li>3. Dog</li>

你他們要重新排序：

<li>2. Mouse</li> 
<li>1. Cat</li> 
<li>3. Dog</li>

陣營在默認情況下不會交換<li>項目。但更改<li>項目內的文本（因爲這是更輕的DOM更新）。要強制反應以交換項目，您需要爲每個組件提供一個密鑰。反應網站的進一步說明：https://facebook.github.io/react/docs/multiple-components.html#children

如果你可以分享一些代碼，這將使它更容易理解你的具體問題。

來源

2015-10-02 08:04:36 wintvelt

你是對的。在我的情況下，我沒有使用li項目，而是在父'div'內部有'div'列表。每個*都被分配一個鍵，因爲它們是使用'.map'從一個數組中動態呈現的。我的問題是，當我改變底層數組（例如，將數組換成完全不同的數組）時，它會保留舊節點並替換其中的文本，並只渲染新節點。儘管每個節點都有一個密鑰，但會發生這種情況我可以看到這是怎麼可能是有用的，重複使用舊的節點，但在我的情況下，它（有時）我想要的行爲相反... –

如果我給節點一個唯一的ID爲重點，這將迫使它重新投降？ –

你確定你是以正確的反應方式分配鍵嗎？（有一個錯誤的方法來做到這一點，然後它不起作用）。請參閱：https：//facebook.github.io/react/docs/multiple-components.html#dynamic-children，瞭解使用密鑰的正確方法和錯誤方法。 – wintvelt

重新呈現DOM的陣營

回答

相關問題