【React-Native Expo】ImagePickerで選択した画像JPGをCanvasに表示する方法

React-Native Expo環境です。
ImagePickerで選択したフォトギャラリーの画像（写真）を、Canvasに表示出来無くて困っています。
App.jsと同階層に用意した画像なら表示出来ます。

以下抜粋です。なお、どうしてもCanvasを使用したいです。

import * as ImagePicker from 'expo-image-picker';
import Canvas, {Image as CanvasImage} from 'react-native-canvas';

selectImage = async () => {
    let response = await ImagePicker.launchImageLibraryAsync({
        mediaTypes: ImagePicker.MediaTypeOptions.All,
        allowsEditing: true,
        aspect: [4, 3]
    })

    if (!response.cancelled) {
        const image = new CanvasImage(this.tempCanvas);
        this.tempCanvas.width = 100;
        this.tempCanvas.height = 100;
        const ctx = this.tempCanvas.getContext('2d');

        //const asset = Expo.Asset.fromModule(require('./test1.jpg'));
        const asset = Expo.Asset.fromModule(response.uri.replace('file://', ''));
        image.src = asset.uri;
        image.addEventListener('load', () => {
              ctx.drawImage(image, 0, 0, 100, 100);
        });
      }
  }

  render() {
      return (
          <Canvas ref={ref => {
                this.tempCanvas = ref;
          }}/>
      )
  }

「./test1.jpg」のコメント部分を外すとちゃんと表示されますが、ImagePickerのresponse.uriでは表示されない、という状況です。response.uriには画像までのパスがちゃんと入っています。もちろんいろんな試行錯誤（base64に変えたりfile://を付けたりなど）を行って、この形になっています。

一度、App.jsと同階層あたりにresponse.uri画像を書き出し、これを取り込まないとダメでしょうか？

どなたか分かる方がいらっしゃれば幸いです。
よろしくお願い致します。

行動規範の内容に同意します

回答1件

expo-image-picker

上記のリファレンスを見ましたが、response.uriをExpo.Asset.fromModule()で変換する必要がないのでは？

javascript
1selectImage = async () => {
2    let response = await ImagePicker.launchImageLibraryAsync({
3        mediaTypes: ImagePicker.MediaTypeOptions.All,
4        allowsEditing: true,
5        aspect: [4, 3]
6    })
7
8    if (!response.cancelled) {
9        const image = new CanvasImage(this.tempCanvas);
10        this.tempCanvas.width = 100;
11        this.tempCanvas.height = 100;
12        const ctx = this.tempCanvas.getContext('2d');
13
14        //const asset = Expo.Asset.fromModule(require('./test1.jpg'));
15        //const asset = Expo.Asset.fromModule(response.uri.replace('file://', ''));
16        //image.src = asset.uri;
17        image.src = response.uri;
18        image.addEventListener('load', () => {
19              ctx.drawImage(image, 0, 0, 100, 100);
20        });
21    }
22}