2017-08-08 6 views
0

Ich versuche tabs from semantic-ui in meiner Next.js App zu implementieren.Next.js und Semantic UI, Registerkartenelement, Fehler: Elementtyp ist ungültig

ich diese Störung erhalte:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of TabExampleBasic .

Dies ist der Code:

import React from 'react' 
import { Tab } from 'semantic-ui-react' 

const panes = [ 
    { menuItem: 'Tab 1', render:() => <Tab.Pane>Tab 1 Content</Tab.Pane> }, 
    { menuItem: 'Tab 2', render:() => <Tab.Pane>Tab 2 Content</Tab.Pane> }, 
    { menuItem: 'Tab 3', render:() => <Tab.Pane>Tab 3 Content</Tab.Pane> }, 
] 

const TabExampleBasic =() => (
    <Tab panes={panes} /> 
) 

export default TabExampleBasic 

ich importiert diese Komponente in Seiten/index.js. Andere Komponenten von Semantik-Ui wie Card, Grid oder Akkordeon funktionieren ohne Probleme.

ich mit diesem Beispiel arbeite: https://github.com/zeit/next.js/tree/master/examples/with-semantic-ui

+0

Ist das 'semantic-ui-react' richtig installiert? Versuchen Sie nach dem Import nach 'console.log (Tab);'. Wenn es hier nicht definiert ist, ist das Problem. –

+0

Sie haben Recht, da ist das Problem. Ich habe es neu installiert und es funktioniert jetzt. – danieljacky

Antwort

0

Tab Komponente wurde in 0.70.0 hinzugefügt, prüfen Sie, ob Sie diese Version oder höher.

Verwandte Themen