Binding element 'src' implicitly has an 'any' type.

内容

「React 実践入門」3-2(p96)のコードを記述していました。
本ではjsファイルでの実装になっており、型定義が行われていませんでした。
ですが私は環境構築時にtypescriptもインストールして.tsxファイルでの実装をした為、「型定義をしてませんよ」と怒られた、というのが今回のエラーの内容です。
型定義をしたところ解決しました。

修正前コード

Forfilter.tsx

import React from 'react';

export default function ForList({ src }) {
    return (
    <dl>
      {src.map(elem => (
        <React.Fragment key={elem.isbn}>
          <dt>
            <a href={`https://wings.msn.to/books/${elem.isbn}/${elem.isbn}.jpg`}>
                {elem.title}（{elem.price}円）
            </a>
          </dt>
          <dd>{elem.summary}</dd>
        </React.Fragment>
      ))}
    </dl>
    );
  }

関連コード

Index.tsx

import books from './books';
import Forfilter from './ForFilter';


const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <Forfilter src={books} />
);

books.js

const books = [
  {
    isbn: '978-4-8156-1336-5',
    title: 'これからはじめるVue.js 3実践入門',
    price: 3740,
    summary: 'JavaScriptフレームワーク「Vue.js」について解説した入門書です。',
    download: true,
  },
  ・・・
  ]
export default books;

エラー内容

Binding element 'src' implicitly has an 'any' type.

修正後コード

Forfilter.tsx

import React from 'react';

type Book = {
    isbn: string;          // ISBNコードは文字列型
    title: string;         // 書籍タイトル
    price: number;         // 価格は数値型
    summary: string;       // 書籍の説明
    download: boolean;     // ダウンロード可能かどうかのフラグ
};

type ForListProps = {
    src: Book[];           // `src`はBook型の配列
};


export default function ForFilter({ src }: ForListProps){
    return(
        <dl>
            {src.map(elem => (
                <React.Fragment key={elem.isbn}>
                <dt>
                    <a href={`https://wings.msn.to/books/${elem.isbn}/${elem.isbn}.jpg`}>
                        {elem.title}（{elem.price}円）
                    </a>
                </dt>
                <dd>{elem.summary}</dd>
                </React.Fragment>
            ))}
        </dl>
    )
}

無事解決しました。