我遵循了一些教程，一切都为这个家伙工作，但不为我。我使用axios试图获取一些简单的数据，但我在控制台中得到一个无法读取属性错误，它是不获取和不显示数据。
我认为我的设置是非常基本的，所以我真的很想知道我在这里做错了什么。我的PHPSorm没有标记任何错别字，所以我不确定我这样做是正确的。
下面是我的DataFetching.js代码：

import React, {useState, useEffect} from "react";
import axios from "axios";

function DataFetching(){
    const [post, setPost] = useState();
    const [id, setId] = useState(1)
    const [idFromButtonClick, setIdFromButtonClick] = useState(1)

const handleClick = () => {
    setIdFromButtonClick(id)
}

useEffect(() => {
    axios.get(`https://jsonplaceholder.typicode.com/posts/${idFromButtonClick}`)
        .then(res => {
            console.log(res);
            setPost(res.data)
        })
        .catch(err => {
            console.log(err)
        })
}, [idFromButtonClick])

return (
    <div>
        <input type="text" value={id} onChange={e => setId(e.target.value)} />
        <button type="button" onClick={handleClick}>Fetch</button>
        {post.title}
    </div>
)
}

export default DataFetching

我得到的错误是：
数据获取.js：27未捕获类型错误：无法在DataFetching（DataFetching.js：27：1）处读取未定义的属性（阅读“title”）
有谁能给我指个方向吗？