Nextjs-Reactjs-不变违规：React.Children.only仅接收单个React元素子元素

我正在使用Nextjs和Reactjs。我已经为我的应用程序UI设置了Layout.js文件。

我不知道为什么我的控制台会返回我：

不变违规：React.Children.only只希望接收一个React元素的孩子。

这是我的layout.js：

export default ({ children, title = 'This is the default title' }) => (
    <div>
        <Head>
        <title>{ title }</title>
        <meta charSet='utf-8' />
        <meta name='viewport' content='initial-scale=1.0, width=device-width' />
        </Head>
        <div className={style.layout}>
            <div>
                <div className={style.header}>
                    <div className= {style.headbar}> 
                        <div className={style.headerLeft}>
                            <Logo className={style.logo}/> 
                        </div>
                        <div className={style.headerRight}>
                            <MenuContainer className={style.menu}/> 
                        </div>
                    </div>
                    <div className={style.chatbox}> 
                        <ChatContainer/>
                    </div>
                </div> 

                { children }

                <div className={style.footer}> 
                    <Link to="/quote" className={style.quote}> 
                        Click here
                    </Link>
                    <SocialMedia/>
                    <Subscription/>
                </div>
            </div>
        </div>
    </div>
)

我的wrappedComponent.js：

const Index = () => (
      <Provider store={store}> 
            <Layout> 
                  <Home/>
            </Layout>
      </Provider>
)

我不知道出什么问题了，在我看来，一切都很好，如果有人有任何暗示，那就很好了，

thanks