Cómo usar JQuery en ReactJS

Soy novato con ReactJS. Hasta ahora estoy usando JQuery para configurar cualquier animación o alguna característica que necesite. Pero ahora estoy tratando de usar ReactJS y minimizarlo usando JQuery.

Mi caso es:
Estoy tratando de construiracordeón propio, con JQuery puedo hacerlo, pero con ReactJS no tengo la idea de cómo hacerlo.

<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();
});

Mi pregunta:
1. ¿Cómo hacer eso en ReactJS?


Gracias antes

Respuestas a la pregunta(4)

Su respuesta a la pregunta