reactjs - xlsx 文件以在 react-native 中转换 base64 url​​？

Question

我编写了一个创建xlsx文件的代码，它 writeFile在设备上。我Sheet JS xlsx 为此实现使用了库。但我想将其转换xlsx file为base64 url，因为我可以通过任何社交媒体应用程序在其他设备上共享此文件。

那么，如何将xlsx 文件转换为base64 Url

我的代码：

import XLSX from 'xlsx';
import RNFS from 'react-native-fs';
import React, {Component} from 'react';
import {StyleSheet, Text, Button, Alert, ScrollView} from 'react-native';

const directoryPath = RNFS.ExternalStorageDirectoryPath + '/';

const data = {
  headers: ['Name', 'Country', 'City', 'Mobile', 'Salary', 'Date', 'PAN'],

  rows: [
    ['Maxwell', 'Australia', 'Sydney', '123', '$22', '02/02/89', 'yes'],
    ['Mark', 'Canada', 'Toronto', '056', '$8965', '12/06/02', 'no'],
    ['David', 'United Kingdom', 'London', '242', 'S23', '25/02/20', ''],
    ['Kohli', 'India', 'Delhi', '8956', '$32', '04/12/21', 'yes'],
    ['ABD', 'RSA', 'captown', '4515', '$32', '2/11/08', null],
  ],
};

export default class TestSheet extends Component {
  constructor(props) {
    super(props);
    this.state = {};

    this.dataExport = this.dataExport.bind(this);
  }

  componentDidMount() {}

  uigrid_to_sheet = (Rows, columns) => {
    let mainArray = [],
      subArr = [],
      i = 0,
      j = 0;

    /* column headers */
    for (j = 0; j < columns.length; ++j) {
      subArr.push(columns[j]);
    }
    mainArray.push(subArr);

    /* table Rows */
    for (i = 0; i < Rows.length; ++i) {
      subArr = [];
      for (j = 0; j < Rows[i].length; ++j) {
        subArr.push(Rows[i][j]);
      }
      mainArray.push(subArr);
    }
    /* aoa_to_sheet converts an array of arrays into a worksheet object */
    return XLSX.utils.aoa_to_sheet(mainArray);
  };

  dataExport() {
    const sheetName = 'users_sheet';
    const wopts = {bookType: 'xlsx', bookSST: true, type: 'binary'};

    const wb = XLSX.utils.book_new();
    const ws = this.uigrid_to_sheet(data.rows, data.headers);

    ws['!ref'] = XLSX.utils.encode_range({
      s: {c: 0, r: 0},
      e: {c: data.headers.length, r: 1 + data.rows.length + 1},
    });

    XLSX.utils.book_append_sheet(wb, ws, sheetName);
    const wbout = XLSX.write(wb, wopts);

    //console.log('wbout', wbout);

    /******Encode base64***********/
    const reader = new FileReader();
    reader.readAsDataURL(wbout);
    reader.onloadend = function () {
      const base64data = reader.result;
      console.log('--', base64data);
    };
    /**********End*********** */
    let path = `${RNFS.ExternalStorageDirectoryPath}/VcraftApp`;
    RNFS.mkdir(path)
      .then((res) => {
        Alert.alert('Directory success!', res);
        const file = path + '/companylist3.xlsx';

        RNFS.writeFile(file, wbout, 'ascii')
          .then((response) => {
            Alert.alert('Export Success!', 'Exported to ' + file, response);
          })
          .catch((err) => {
            Alert.alert('Export Failed!', 'Error ' + err.message);
          });
      })
      .catch((error) => {
        Alert.alert('Directory Failed!', 'Error ' + error.message);
      });
  }

  render() {
    return (
      <ScrollView contentContainerStyle={styles.container} vertical={true}>
        <Text style={styles.welcome}> </Text>

        <Text style={styles.instructions}>Export Data</Text>
        <Button
          onPress={this.dataExport}
          title="Export data to XLSX"
          color="blue"
        />

        <Text style={styles.instructions}>Table Data</Text>
      </ScrollView>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  instructions: {textAlign: 'center', color: '#333333', marginBottom: 5},
  thead: {height: 40, backgroundColor: 'skyblue'},
  tr: {height: 30},
  text: {marginLeft: 5},
  table: {width: '100%'},
});