我有一個 React/TypeScript 組件，我正在嘗試將模擬數(shù)據(jù)導(dǎo)入其中，然后對其進(jìn)行迭代以在 span 元素中顯示特定屬性。我遇到的問題是我似乎無法將模擬數(shù)據(jù)傳遞到我的組件中以對其進(jìn)行迭代，同時我也收到奇怪的類型錯誤，這似乎表明我正在使用類型定義我的數(shù)據(jù)或我的道具的數(shù)據(jù)本身，但從不兩者兼而有之。我創(chuàng)建了一個 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>  );};