CSSTransition and react-tabs, React.Children.only expected

274 views Asked by At

I tried to make some animation to TabPanel, keeps sending me this error (Error: React.Children.only expected to receive a single React element child.) If i move the oputside the Tabs it works otherwise it throughs the error

import React strong textfrom "react";
import {Tab, TabList, TabPanel, Tabs} from 'react-tabs';
import {CSSTransition} from 'react-transition-group';

function App() {
   return (
       <div>
        <Tabs>
         <TabList>
                <Tab>Overview</Tab>
                <Tab>Education</Tab>
            </TabList>
            <CSSTransition in={true}
                           apear={true}
                           timeout={50}
                           classNames="fade">
                <TabPanel>
                       <h1>Text 1 Here</h1>
                    </TabPanel>
                </CSSTransition>
               <TabPanel>
                   <h1>text 2 Here</h1>
               </TabPanel>
           </Tabs>
        </div>
    )
}
0

There are 0 answers