跳到主要内容

react-hello-bugs

Objects are not valid as a React child​

在react里这段代码出错


export default function DocItemLayout({children}) {
  const docTOC = useDocTOC();
  const { frontMatter, toc } = useDoc();
  return (
        <div className="row">
            {frontMatter.date != null && (<div className="doc-date"> created at {frontMatter.date} </div>)}
       </div>
  )
}

 Objects are not valid as a React child (found: Tue May 17 2033 08:00:00 GMT+0800 (China Standard Time)). If you meant to render a collection of children, use an array instead.

问题是react不能渲染对象, 上面的frontMatter.date被处理为date对象了, 需要切换为string才行.


{frontMatter.date != null && (<div className="doc-date"> created at {frontMatter.date.toString()} </div>)}

Fix "Objects are not valid as a React child" error in React

about:blank

It's thrown when you try to directly render an object in JSX, instead of using a valid React child such as a string, number, or React element.