[英]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.