false warning about "'Tab' outside 'TabList'" when using Immutable seq

Abierto
#198 4 comentarios 1 reacción 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
45/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Estancado
Stack tecnológico
javascript, react
Área
frontend

Línea de trabajo

Comienza ejecutando la reproducción en JSX con Immutable OrderedMap y react-tabs; después compara keySeq().map() con las variantes toArray() y toList() mostradas en el issue. Rastrea la advertencia sobre Tab fuera de TabList e identifica por qué solo la forma de secuencia Immutable la activa. Se considera terminado cuando el ejemplo de keySeq() se renderiza sin la advertencia falsa y los paneles de pestañas siguen funcionando.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

bug 
import React from 'react';
import { OrderedMap } from 'immutable';
import { Tabs, Tab, TabList, TabPanel } from 'react-tabs';

const tabData = OrderedMap({
  one: '1',
  two: '2',
  three: '3',
});

export default function Test() {
  return <div>
    <Tabs>
      <TabList>
        {
          // This line triggers `Failed prop type: Found a 'Tab' component outside of the 'TabList' component. 'Tab' components have to be inside the 'TabList' component.`
          tabData.keySeq().map(key => <Tab key={key}>{key}</Tab>)
          // If change to use toArray() or toList(), the warning disappears.
          // tabData.keySeq().toArray().map(key => <Tab key={key}>{key}</Tab>) // no warning
          // tabData.keySeq().toList().map(key => <Tab key={key}>{key}</Tab>)  // no warning
        }
      </TabList>

      {
        tabData.entrySeq().map(([key, value]) => <TabPanel key={key}>{value}</TabPanel>)
      }
    </Tabs>
  </div>;
}
Lenguaje dominante
JavaScript
Estrellas
3.1k
Forks
455
Merge medio
5 h 9 min
PR fusionados (30 d)
2

Guía de contribución

No hay ninguna guía de contribución indexada para este repositorio

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de reactjs/react-tabs

Todos los issues de reactjs/react-tabs

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.