如何在 React Native 中将 base64 图像字符串加载到图像滑块中？

Question

我正在使用预填充的 sqlite 数据库，图像以 BLOB 数据类型存储..

现在我想在 React Native 中检索图像并在 Image SliderBox 中显示，但不知何故无法做到。我使用了来自 react-native-image-slider-box 的 SliderBox；

下面是我的代码

constructor() {
    super();
    this.state = {
      courtimages: [],
    }
  }
 getCourtImages (court_name){
    var that = this;
    db.transaction((tx) => {
      tx.executeSql('SELECT Image_Value FROM court_images where Court_Name= "Allahabad"', [], (tx, results) => {
        var len = results.rows.length;       
        if (len > 0) {
          let rowallimages = [];
          for (let i = 0; i < len; i++) {
            var base64Icon = 'data:image/png;base64,results.rows.item(i)'; //not working
            rowallimages.push(base64Icon);
          }
          this.setState({ courtimages: rowallimages })
        }
      });
    });
  }

<SliderBox
          images={this.state.courtimages}
          sliderBoxHeight={400}
          dotColor="#FFEE58"
          inactiveDotColor="#90A4AE"
          autoplay
          circleLoop
          resizeMethod={'resize'}
          resizeMode={'cover'}
          ImageComponentStyle={{ borderRadius: 15, width: '100%'}}
        />

如何将来自 slqlite 数据库的 BLOB 图像显示到滑动框反应本机？？？请帮忙，因为我是 React Native 开发新手....

Answer 1

您的函数应如下所示，

getCourtImages (court_name){
    var that = this;
    db.transaction((tx) => {
      tx.executeSql('SELECT Image_Value FROM court_images where Court_Name= "Allahabad"', [], (tx, results) => {
        var len = results.rows.length;       
        if (len > 0) {
          let rowallimages = [];
          for (let i = 0; i < len; i++) {
            var base64Icon = `data:image/png;base64,${results.rows.item(i)}`; //not working
            rowallimages.push(base64Icon);
          }
          this.setState({ courtimages: rowallimages })
        }
      });
    });
  }

主要变化是

var base64Icon = `data:image/png;base64,${results.rows.item(i)}`; //not working

如何在 React Native 中将 base64 图像字符串加载到图像滑块中？

How to load base64 image string into image slider in react native?

sqlite

base64

image

react-native