类型“never”上不存在属性“map”该如何解决？

在使用 React 编写页面的实际过程中，JavaScript 有一种经典的获取数据之方法。

import React, { useEffect, useState } from "react";
import requestData from "./apis";
export default function AllPosts() {
const [allData, setAllData] = useState(null);
useEffect(() => {
        requestData
        .fetch(
            //balabalabala
            //根据接口文档与后端交互
        .then((data) => setAllData(data))
        .catch(console.error);
    }, []);
    return (
            <h3>All data</h3>
                { allData && 
                allData.map((datum, index) => (
                      <span key={index}>
                              <h2>{datum.content}</h2>
                      </span>
            </div>
        </div>
在这则片段中，我们定义了一个组件。其中，我们使用 useState 将 allData 的默认值设为 null ，并使用 useEffect 在每次 render 时都采用 requestData.fetch 方法向后端请求数据，使用 setAllData 将 allData 从 null 赋值为实际返回值。
然而，若将其原封不动复制到 TypeScript 中使用，则会出现以下报错。
怎么回事呢？我们凑近来看看。
定睛一看，TypeScript 竟将初始值为 null 的 allData 推导为 never。毕竟，never 怎么会有属性 map 呢？
解决方法其实很简单，我们不把 allData 初始化为 null 不就行了？只要根据实际接口会返回的数据将 allData 声明为内容为 类型或接口为Data的 数组，初始化（设默认值）为空数组即可。比如：
interface Data {
        content: string;
        // 还有很多属性
const [allData, setAllData] = useState<Array<Data>>([]);
这时我们凑近再看看：
显然，allData 变成了数组。此时它再调用 map 方法就没有任何问题了：）
希望这篇文章对你有帮助。