我有一个工作的Django REST API，它返回以下内容：

{
    "id": 1,
    "brand": "peugeot",
    "model": "3008",
    "variant": "allure"
}

字符串
我使用下面的代码来获取上述数据：

render() {
        const { brand, model, variant } = this.props;
        let url = `http://127.0.0.1:8000/api/car/${brand}/${model}/${variant}/`;
        console.log(url) <== url is correct when checked in console
        fetch(url)
            .then(response => response.json())
            .then(data => data.length === 0 ? this.setState({
                data : data
            }) : null ) <== I have used a condition for setState to stop fetching infintely

        const { data } = this.state;
        console.log(data) <== This is a blank object with no data in console
        console.log(data.id) <== This is undefined in console
        return (
            <div>
                {data.id} <== No data is shown on webpage
                Car Details
            </div>
        );
    }

型
当我尝试在我的网页上获取数据时没有显示错误。我做错了什么？
P.S.当我有一个对象数组时，可以从同一个API服务器获取数据，并且我使用map来循环数据。在这里，我试图获取一个单一的项目，所以没有数组，只是一个对象。我的语法有什么问题吗？