【React Native】Imageコンポーネントで画像を表示する際にヘッダー情報を追加する

タイトル通り、React Native の Image コンポーネントに画像 URL を指定した際に、ヘッダー情報やメソッドも併せて指定する方法についてです。
今回初めて実装したので、備忘録としてまとめ。
なお、特にライブラリ等はインストールする必要はなく、React Native の Image コンポーネントに標準で実装されているものをそのまま使います。

公式サイトはこちらから。

Images · React Native
https://reactnative.dev/docs/images#network-requests-for-images

実装方法ですが、Image コンポーネントを使用する際に下記のように記述するだけです！

<Image
  source={{
    uri: '[表示したい画像パス]',
    method: 'GET',
    headers: {
      // 指定したいヘッダー情報
    }
  }} />

上記サンプルコードのように Props の source で表示したい画像の uri を指定する時に、併せて method や headers を指定することができます。
なお、上記のサンプルコードでは省略しましたが、必要であれば body を指定することもできるとのこと。
このように指定したところ、アクセスの際にヘッダー情報が必要になる画像データも問題なく表示できることを確認できました！

また、React Native Elements の Avatar でも全く同じことができます。
現在開発中のアプリでは、画像表示をほぼ Avatar コンポーネントを使用しているので、Header 情報を追加する処理が Avatar コンポーネントの標準機能で使えてよかったです…！

以上、React Native の Image コンポーネントで画像を添付する際、ヘッダー情報やメソッドを追加する方法についてでした。
ご参考になれば幸いです。