未捕获的类型错误：无法读取未定义的属性（读取“长度”）

Question

I am developing a react app, but i am facing this error-> "Uncaught TypeError: Cannot read properties of undefined (reading 'length')". how to fix this? my code is:

import React from "react";
import { Grid, CircularProgress } from "@material-ui/core";
import Post from "./Post/Post";
import useStyles from "./styles";
import { useSelector } from "react-redux";

const Posts = () => {
  const posts = useSelector((state) => state.Posts);
  const classes = useStyles();

  console.log(posts);
  return (!posts.length ? <CircularProgress/> :(
   <Grid className={classes.container} container alignItems="stretch" spacing={3}>
      {
        posts.map((post)=> (
              <Grid key={post._id} item xs={12} sm={6}>
                <Post post = {post} />
              </Grid>
        ))
      }

   </Grid>
 )
  );
};

export default Posts;

Answer 1

use .post || !post.length .post || !post.length or ?posts..length

Answer 2

You can try something like this, ?posts.?length > -1 ? . As you are checking if the post array is empty or not.

Answer 3

try posts && <Grid>

Answer 4

The error says the type of posts is Undefined. As you are getting that value from Posts in state object, that means that Posts is not initialized in your state. Try initializing "Posts" with empty Array ([]) in your initial state object.