iOS14でReact Nativeアプリをビルドすると、Imageが表示されない場合の対処

はじめに

iOS14のbetaバージョンが配布され、アプリのiOS14対応を迫られている方もいるかと思います。
Xcodeのbeta版で普通にビルドして、iOS14のシミュレーターで起動するとどうやら画像が表示されない。
Imageがおかしいようですね。

9/17追記

XcodeのiOS14対応正式版がリリースされましたが、このXcodeでビルドしてしまうと
Imageが全て表示されないままのようです。
Xcodeをアップデートしていなければパッチを当てなくても大丈夫ですが、アップデート
してしまった方はパッチが必要です。

9/23 追記

React Native 0.63にすればこのパッチの修正が入る様ですが、firebaseあたりでビルドエラーが出る様なのでパッチ対応した方が良さそうです。

Suggestions: Do not upgrade to 0.63 just patch. I tried upgrading, build failed due to firebase, code-push

patchを当てよう

1.プロジェクトのルートディレクトリに、patchesというフォルダを作ります。
2.作ったフォルダの中にreact-native+0.61.2.patchというファイルを作ります。
3.作ったファイルの中身を入れます。

diff --git a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
index 01aa75f..4ef8307 100644
--- a/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
+++ b/node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.m
@@ -269,6 +269,8 @@ - (void)displayLayer:(CALayer *)layer
   if (_currentFrame) {
     layer.contentsScale = self.animatedImageScale;
     layer.contents = (__bridge id)_currentFrame.CGImage;
+  } else {
+    [super displayLayer:layer];
   }
 }

4.プロジェクトのルートディレクトリでnpx patch-packageを実行
5.node_modules/react-native/Libraries/Image/RCTUIImageViewAnimated.mを開き、267行目付近が以下のようになっていることを確認する。

- (void)displayLayer:(CALayer *)layer
{
  if (_currentFrame) {
    layer.contentsScale = self.animatedImageScale;
    layer.contents = (__bridge id)_currentFrame.CGImage;
  } else {
    [super displayLayer:layer];
  }
}

6.終了です。キャッシュをクリアしてビルドしてみましょう！

参考

https://github.com/facebook/react-native/issues/29279
ここにあるパッチだとうまくいかないことがあるので、別の回答をパッチ化しました。