我尝试使用 map function 在 react-hooks useState 中循环我的列表数据，但我遇到了一个错误，目的未定义

Question

I tried to use map function for looping my list data in react-hooks useState but I stuck with an error, purposes is not defined. I want to show purposes in the dashboard but its not getting showed there.

    const UserAccountDetails = props => {
      const { className, userid, user, ...rest } = props;
      const classes = useStyles();
      const [parameters, setParameters] = useState([]);
      // const [user, setUser] = useState({});
      const [open, setopen] = useState(false);
> Here I have defined the states. Its showing that purposes is not defined.
      const [state, changeState]=useState([
        purposes=[" "]
      ])
 > Here I have handled the events 
    const handleEventPurpose = event => {
        const { target } = event;
    
        changeState(state => ({
          ...state,
          eventTitle: target.value
        }));
      };
    
    return (
    <div>
    .....
    
    <Typography
                    gutterBottom
                    color="textSecondary"
                    variant="h6"
                    onChange={handleEventPurpose}
                  >

>Here I am mapping the purposes.But still getting error that purpose is not defined
                    {
                      state.list.map((purpose)=>(
                        <Typography>
                          <p>Purpose: {user.purpose}</p>
                        </Typography>
                      ))
                    }
                    
    
                  </Typography>
    </div>
    )
    
    

Answer 1

You cannot use state.list property as state is an array not an object.