我有一個 React/TypeScript 組件，我正在嘗試將模擬數據導入其中，然后對其進行迭代以在 span 元素中顯示特定屬性。我遇到的問題是我似乎無法將模擬數據傳遞到我的組件中以對其進行迭代，同時我也收到奇怪的類型錯誤，這似乎表明我正在使用類型定義我的數據或我的道具的數據本身，但從不兩者兼而有之。我創建了一個 CodeSandbox 來突出顯示這些問題，并在我看到以下錯誤的地方包含了我的主要組件：Current Componentimport React from 'react';import contacts from '../../mock-data/contacts-mock-data';import { Contacts, ContactGroup } from '../../services/contacts-client';type Props = {  contacts: Contacts[];  contactGroups: ContactGroup[];};export const ContactGroupsSection = (props: Props) => {  const { contacts, contactGroups } = props  let groups = () => {    for (let i = 0; i < contacts.contactGroups.length; i++) {      return <span>{contacts.contactGroups.contactGroup}</span>;    }  };  return (    <div>{groups}</div>  );};