调用 api 未读取对象

Question

当我使用 console.log 调用详细信息时，没有任何显示错误 exam: console.log(coin.description.en); 但是当我编写此代码时 {coin.description.en} 在渲染中不起作用并显示此错误： TypeError：无法访问属性“en”，coin.description 未定义

import React, {useEffect, useState} from "react";
import {connect} from 'react-redux';
import axios from 'axios';

function CoinDetail({...props}) {
    const [coin,setCoin] = useState([]);

    useEffect(() => {
        getCoinDetail(API_URL+'ripple');
    },[]);

    const getCoinDetail = (id) => {
        axios.get(id).then(res => {
            setCoin(res.data);
            console.log(res.data);
        });
    }
    
    return (
        <>
            Id: {coin.id}<br/>
            Name: {coin.name}<br/>
            Symbol: {coin.symbol}<br/>
            Description: {coin.description.en}<br/>
        </>
    );
}

function mapStateToProps(state,ownProps) {
    const coinId = ownProps.match.params.coinId;
    return {
        coinId
    }
}

export default connect(mapStateToProps)(CoinDetail);

Answer 1

尝试用{coin.description && coin.description.en} 代替{coin.description.en}