ReactJs无法从FETCH获取对象的值

Question

我已经实现了访存并将其设置为对象。但是，当我想获得其价值时。它显示未定义，对此我一无所知。这是代码。

import {useEffect,useState} from 'react';
import { useRouter, Router } from 'next/router';
import Layout from '../../components/MyLayout';
import Settings from '../../components/Settings';

const Post = (props) => {

  const [object, setObject] = useState({});
  const router = useRouter();

  useEffect(
    () => {
      const data = router.query;
      const FormData = new URLSearchParams();
      FormData.append('slug',data.id);
      fetch(Settings.api+'viewPost',{
        method: 'POST',
        body: FormData
      })
        .then(res=>res.json())
        .catch(function(e){
            console.log(e)}
        )
        .then(obj=>{
            setObject(obj)
            //console.log(obj.data[0]); -- works from here
        })
    }
    , [router.query]
  )
  //console.log(object.data[0]); --> does not work here
  return (
    <Layout>
      <h1>{router.query.id}</h1>
    </Layout>
  );
}

export default Post;

无论如何，这是我要实现的json

{
  "page": 1,
  "total": 0,
  "data": [
    {
      "postId": 4,
      "boardId": "",
      "username": "[email protected]",
      "title": "How To Make Money",
      "slug": "how-to-make-money",
      "answer": 0,
      "checked": 0,
      "status": "",
      "waktu": "2019-10-16 04:45:30"
    }
  ]
}

非常感谢您的回答。谢谢。

Answer 1

仅尝试记录console.log(object)，您已经将object状态的值设置为obj.data[0]的值。