586 viewsMern Amazona

i got this error when i type one of the name of the product Uncaught TypeError: Cannot read properties of undefined (reading ‘slug’)
at ProdGame (ProdGame.js:31:1) and a white page is display but everything is normal when i type a inexistent product

there is my code

[apcode language=”jscript”]import Card from 'react-bootstrap/Card';
import Button from 'react-bootstrap/Button';
import { Link } from "react-router-dom";
import Rating from './Rating';
import axios from 'axios';
import { useContext } from 'react';
import { Store } from '../Store';
function ProdGame(props){
const {Games} = props;
const {state, dispatch: ctxDispatch} = useContext(Store);
const {
cart: {cartItems},
} = state;
const addToCartHandeler = async(item, )=> {
const existItem = cartItems.find((x)=> x._id === item._id);
const quantity = existItem ? existItem.quantity + 1 : 1;
const { data } = await axios.get(`/api/Games/${item._id}`);
if(data.countInStock < quantity){
window.alert('sorry. No more codes available');
return ;
}
ctxDispatch({
type: 'CART_ADD_ITEM',
payload: {...item, quantity}
});
};
return(
<Card>
<Link to={`/game/${Games.slug}`}>
<img src={Games.image} className="card-img-top" alt={Games.name} />
</Link>
<Card.Body>
<Link to={`/game/${Games.slug}`}>
<Card.Title>{Games.name}</Card.Title>
</Link>
<Rating rating={Games.rating} numReviews={Games.numReviews} />
<Card.Text>{Games.price}</Card.Text>
{Games.countInStock === 0 ?( <Button variant='light' disabled> Out of codes</Button> ) : (
<Button onClick={() => addToCartHandeler(Games)}>Add to cart</Button>
)}
</Card.Body>
</Card>
);
}
export default ProdGame;
[/apcode]

Bassir Answered question March 10, 2023

it means product is undeifned. the issue is in backend api for product. check it out.

Bassir Answered question March 10, 2023
You are viewing 1 out of 1 answers, click here to view all answers.