Error:Element type is invalid: expected a string (for built-in components)or a class/function(for composite components)but got:object

Question

import React from 'react'

const Newslist=(props)=>{  
    const Items = props.news.map((item)=>{
    return (<h2>{item.title}</h2> )
    });
    return(<div> <Items/> </div>)
}

export default Newslist;

这段代码在 dom 中没有显示任何内容并显示错误

Error:Element type is invalid: expected a string (for built-in components)or a class/function(for composite components)but got:object

Answer 1

你正在渲染 Items 就好像它是一个 React 组件而不是一个 JSX 变量。正如错误所说，React 组件只能从字符串（在 HTML 元素的情况下）、类或函数创建。当您使用 <JSX/> 语法呈现某些内容时，它会作为参数传递给 React.createElement。 JSX 元素数组，即您的 map 调用 returns，不是可接受的参数类型之一，因此您会收到此错误。我认为这应该有效：

import React from 'react'

const Newslist=(props)=>{  
    const items = props.news.map((item)=>{
    return (<h2>{item.title}</h2> )
    });
    return(<div> {items} </div>)
}

export default Newslist;

Error:Element type is invalid: expected a string (for built-in components)or a class/function(for composite components)but got:object

Error:Element type is invalid: expected a string (for built-in components)or a class/function(for composite components)but got:object

json

node.js

reactjs

react-native

react-props