React js:未捕获错误:对象作为React子对象无效

Question

我正在尝试显示数组中的数据。阵列来自一个减速器。我想用.map方法做，但(在produit.map上(出现了一个错误。我不知道为什么，但它返回给我"；未捕获错误：对象作为React子对象无效；。控制台也告诉我，他们找到了带钥匙的对象。有人能帮帮我吗？

const LastProduit = () => {
const dispatch = useDispatch();
const step = 3;
const [count, setCount] = useState(step);
useEffect(() => {
dispatch(getProduit());
}, [dispatch,]);
const { height, width } = useWindowDimensions();
const produits = useSelector((state) => state.produitReducer);
const produitsArray = produits;
const RealProduitArray = produitsArray[0];
console.log(produits);
console.log(RealProduitArray);
//console.log(RealProduitArray[0].titre);
const a = [produits];
const b = 1 + produits.length
for (let i = 0; i < b; i++) {
return a[i];
}
let screenwidth = { width };
let nbr = 0;
let nbrspace = 0;
let valeur = "true";
console.log(screenwidth.width);

if (screenwidth.width <= 768) { nbr = 2; nbrspace = -60; valeur = "false" }
else { nbr = 4; nbrspace = -170; }
return (
<div className='LastProduit'>
<p className='categories_titre'>Derniers Produits  </p>
<div className='LastProduit_img'>
<Swiper modules={[Navigation, Pagination, Scrollbar, A11y]}
spaceBetween={nbrspace}
slidesPerView={nbr}
navigation
pagination={{ clickable: true }}
scrollbar={{ draggable: true }}
onSwiper={(swiper) => console.log(swiper)}
onSlideChange={() => console.log('slide change')}
>
{produits.map((produit) => 
<SwiperSlide>
<Produit produit={produit} key={produit._id} />
</SwiperSlide>
)}

</Swiper>
</div>
</div>
);

}；

Answer 1

映射函数需要一个return语句。在多行回调函数中，必须包含return关键字。

示例：

{ 
produits.map((produit) => {
return (
<SwiperSlide>
<Produit produit={produit} key={produit._id} />
</SwiperSlide>
)
}) 
}