我从 API 中收到一个对象，其中包含一些简单属性和一个字符串数组。我尝试使用 map 函数显示此数组，但当我尝试使用 map 函数时，我的应用程序会中断并抛出“TypeError：tags 未定义”。代码：

import React, { Component } from 'react';
import {useParams} from "react-router-dom";
import VideoPlayer from "../Video/VideoPlayer";
import { withRouter } from "react-router";

class VideoDetails extends Component {
constructor(props) {
    super(props);
    this.state = 
    {
        video: {}
    }
}

componentDidMount() {
    const url = "https://localhost:44362/api/Video/" + this.props.id;
    fetch(url)
    .then(resp => resp.json())
    .then(json => this.setState({ video: json }))
  }

render() {
    const {video} = this.state;
    const tags = video.tags;

    console.log(tags);
    console.log(video);

    return (
        <div>
            <h1>{video.title}</h1>
            <VideoPlayer />

            <h2>Video ID {video.id}</h2>
            <br></br>
            <h3>Description</h3>

            <p>{video.description}</p>

            <h3>Tags</h3>
            <ul>
                {
                    tags.map(
                        (tag) => 
                        (
                            <li>{tag}</li>
                        )
                    )
                }
            </ul>
        </div>
    );
}
}

export default VideoDetails;

我感觉它不知道 video.tags 是一个数组，但我不太确定如何解决这个问题。我可以删除 map 函数并直接打印出数组，但 map 不起作用。我不太清楚我在这里做错了什么，我遇到的很多示例似乎都是直接处理数组。