[英]Getting TypeError: props.children is not a function when trying to set props.children
[英]Receiving props.children is not a function
尝试将自定义道具从布局传递给子级时,我收到以下信息: TypeError: props.children is not a function
布局(功能组件汇总)
import React, { useState } from 'react'
import { useStaticQuery, graphql } from 'gatsby'
export default (props) => {
const {site} = useStaticQuery(
graphql`
{
site {
siteMetadata {
title
}
}
}
`
)
const globals = {title: site.siteMetadata.title}
return (
<>
{props.children({...props, ...globals})}
</>
)
}
Child (也是一个功能组件)
import React from "react"
import Layout from '../components/layout'
export default () => {
return (
<Layout>
<main>
<h1>*site title will go here</h1>
</main>
</Layout>
)
}
渲染 function 图案
要使用渲染 function 模式,您需要将子组件修改为
import React from "react"
import Layout from '../components/layout'
export default () => {
return (
<Layout>
{props => (<main>
<h1>{props.title}</h1>
</main>)}
</Layout>
)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.