Typescript React/Next 通過具有聯合類型屬性的鍵映射 object

Question

我是 TS 新手，在使用聯合類型字符串或數組映射 Object 時無法解決 Typespript 錯誤。 我的方法中的 JS 工作正常，但是在映射字體大小時出現 Typescript 錯誤。 錯誤提示字符串上不存在 map。 我知道這意味着什么，但我不知道如何解決它。 我想知道是否有人可以幫助我。

const fontSizes = {
  xs: '16px',
  md: ['16px', '24px'],
  lg: ['16px', '24px', '32px']
}

 const Typography: NextPage = () => {
  return (
    <>
      {Object.keys(fontSizes).map((k, i) => {
        return (
          <>
            <h2 key={i}>{k}</h2>
            {typeof fontSizes[k as keyof typeof fontSizes] === 'string' &&
              sizes[k as keyof typeof sizes].fontSize}

            {typeof fontSizes[k as keyof typeof fontSizes] === 'object' &&
              sizes[k as keyof typeof sizes].fontSize.map((k, i) => {
                return <span key={i}>{k}</span>
              })}
          </>
        )
      })}
    </>
  )
}