在ReactNative中显示从sqlite blob加载的图像

import React, { useEffect, useState } from 'react';
import { View, Image } from 'react-native';
import SQLite from 'react-native-sqlite-storage';

const DisplayImageFromSQLite = () => {
  const [imageData, setImageData] = useState('');

  useEffect(() => {
    // 连接到SQLite数据库
    const db = SQLite.openDatabase({ name: 'test.db', createFromLocation: '~test.db' });

    // 执行查询语句获取图像数据
    db.transaction((tx) => {
      tx.executeSql(
        'SELECT image FROM images WHERE id = ?',
        [1], // 假设图像的id为1
        (tx, results) => {
          const { rows } = results;
          if (rows.length > 0) {
            const base64Image = rows.item(0).image;
            setImageData(base64Image);
          }
        },
        (error) => {
          console.log('Error retrieving image from SQLite:', error);
        }
      );
    });
  }, []);

  return (
    <View>
      <Image source={{ uri: `data:image/jpeg;base64,${imageData}` }} style={{ width: 200, height: 200 }} />
    </View>
  );
};

export default DisplayImageFromSQLite;