Como usar o JQuery no ReactJS

Sou novato no ReactJS. Até agora, estou usando o JQuery para definir qualquer animação ou algum recurso necessário. Mas agora estou tentando usar o ReactJS e minimizar o uso do JQuery.

Meu caso é:
Estou tentando construirpróprio acordeão, com o JQuery, posso fazê-lo, mas com o ReactJS não entendi como.

<div class="accor">
   <div class="head">Head 1</div>
   <div class="body hide">Body 1</div>
</div>
<div class="accor">
   <div class="head">Head 1</div>
   <div class="body hide">Body 1</div>
</div>
<div class="accor">
   <div class="head">Head 1</div>
   <div class="body hide">Body 1</div>
</div>

usando JQuery:

$('.accor > .head').on('click', function(){
   $('.accor > .body').slideUp();
   $(this).next().slideDown();
});

Minha pergunta:
1. Como fazer isso no ReactJS?


Obrigado antes

questionAnswers(4)

yourAnswerToTheQuestion