與此反應slidetoggle

Question

我試圖讓slideToggle與React一起工作，就像我使用jQuery一樣，但我無法弄清楚如何去做。 我有一個不同的食譜列表，而不是使頁面長得令人難以置信，我想隱藏內容並只顯示每個食譜的標題。當用戶點擊標題時，它會顯示該特定配方的內容。如果標題再次被點擊，則會隱藏該特定內容。 我想爲每個配方內容使用相同的className（'content'），所以我需要「this」來確定要顯示的內容。我如何在React中做到這一點？

在jQuery中我得到了它這樣的

$("h2").click(function(){ 
    $(this).siblings('.content').slideToggle('slow'); 
}); 

，但之後在作出反應我是從這個頁面隱藏與示例中的最後內容的最佳（React jQuery slideToggle）

我沒幾個測試工作」能夠得到這一個工作，可能是這種工作方式..？ react using jquery to slideToggle 我認爲這有點過時，現在可以做得更好？

Answer 1

觸發對標題的onClick功能

onClickHeading() { 
    $("h2").click(() => { 
    $(this).siblings('.content').slideToggle('slow') 
    }); 
} 

Answer 2

這裏接受的答案將工作做好：

Implementing a Read More link in React.js

或者，您也可以擴充使用文本React Router Page Transition

Demo