javascript - 我对 React 和 TypeScript 中的这个简单组件感到困惑

Question

我是 TypeScript 的新手，在这个简单的例子中，我创建了一个组件来从假 API 中获取数据并在 map 中显示它们。迭代:

import React, { FC, useState } from 'react';

const GetData = (): Promise<[]> => {
  return fetch('https://randomuser.me/api/?results=5')
         .then((response: any) => response.json())
         .then((data: any) => data.results);
}

const App: FC<{}> = () => {
  const [users, setUsers] = useState<[]>([]);

  const getUsers = (): void => {
    GetData().then((data: []) => setUsers(data));
  }

  return (
    <div>
      {
        <ul>
          {
            users.map((item: any, index: number) => (
              <li key={`user-${index}`}>{`${item.name.first} {item.name.last}`}</li>
            ))
          }
        </ul>
      }
      <button onClick={getUsers}>Load</button>
    </div>
  )
}

export default App;

这段代码运行良好!但我不确定我的代码是否正确......在这个例子中我有 :any函数输入的类型(例如在 promise 链中)所以，这个例子是否正确？当我在输出中有嵌套数组时，我能在参数中使用许多任何类型吗？
第二个，我没有用 : 添加类型为 GetData ，但那是 const我应该像这样声明它们: const age: number = 40;但我没有收到任何错误？
谢谢

Answer 1

当您使用时 Promise通用定义一个，你不应该将回调函数的类型添加到链中。例如像这样写你的链:

const GetData = (): Promise<User[]> => {
    return fetch('https://randomuser.me/api/?results=5')
        .then((response) => response.json())
        .then((data) => data.results);
}

第二个问题是关于 const age: number = 40;当您定义 const 时并为其分配函数，意味着您正在创建一个函数，而 TypeScript 认为它将是一个函数而不是原始值，因此，您不应该为 const 添加类型在那个名字之后。
但是当你设置如下: const age: number = 40;上面的代码意味着，您正在定义一个原始值，并且应该在名称之后设置类型。