Reactjs ¿cómo usar la función ref dentro del mapa?

Te recomendamos que revises esta resolución en un entorno controlado antes de pasarlo a producción, un saludo.

Solución:

Inicializar this.accordionContent como un array

constructor(props) 
    super()
    this.accordionContent =[];

y establecer el ref como esto

 this.accordionContent[key] = accordionContent className="accordionContent">

Aquí está mi ejemplo de codepen de trabajo basado en su código anterior

El ejemplo vinculado es un acordeón “real”, es decir, mostrar y ocultar contenido adyacente.

(consulte los fragmentos de código a continuación para cambiar a rojo)

---

FRAGMENTOS DE CÓDIGO

inicializar la referencia array:

constructor(props) 
    super();
    this.accordionContent = [];

agregue el ref a la referencia array utilizando el key:

 (this.accordionContent[key] = ref) >

pasa el key a la función de alternar a través de onClick

  this.accordionToggle(key) >

finalmente hacer referencia a la key dentro de la función de alternar

accordionToggle = key => 
    this.accordionContent[key].style.color = 'red'
;

Te mostramos las reseñas y valoraciones de los usuarios

Recuerda dar difusión a esta división si si solucionó tu problema.

---

---

Utiliza Nuestro Buscador