【7】React Nativeでテキストエディタを作ってみる！【エクスポート・バックアップ編】

import * as FileSystem from 'expo-file-system';

function saveMdFile(){
  const fileUri = FileSystem.documentDirectory + 'SimpleMarkdown/myFile.md'
  FileSystem.makeDirectoryAsync(fileUri, true)

}

Possible Unhandled Promise Rejection

export default async function saveMdFile(){
  await MediaLibrary.requestPermissionsAsync()
  const fileUri = await FileSystem.documentDirectory + 'SimpleMarkdown'
  FileSystem.makeDirectoryAsync(fileUri, true)
}

export default async function saveMdFile(){
  await MediaLibrary.requestPermissionsAsync()
  const fileUri = await FileSystem.documentDirectory + 'SimpleMarkdown'
  await FileSystem.makeDirectoryAsync(fileUri, true).then(e=>{
    console.log(e);
  }).catch(err =>{
    console.error(err);
  })
}

ExceptionsManager.js:179 Error: An exception was thrown while calling `ExponentFileSystem.makeDirectoryAsync` with arguments `(
    "file://…省略",
    1
)`

FileSystem.makeDirectoryAsync(fileUri)

> null

await MediaLibrary.requestPermissionsAsync()

FileSystem.readAsStringAsync(fileUri, options)

Error: File 'file://…省略' could not be read.

FileSystem.readDirectoryAsync(fileUri)

export default async function saveMdFile(){
  const directoryUri = FileSystem.documentDirectory + 'SimpleMarkdown/'
  const fileUri = directoryUri + 'test.md'
  FileSystem.writeAsStringAsync(fileUri, "Hello World", { encoding: FileSystem.EncodingType.UTF8 })
    .then(e => {
      console.log("writeAsStringAsync >>" + e);
    }).catch(err => {
      console.error(err);
    })

  FileSystem.readAsStringAsync(fileUri, { encoding: FileSystem.EncodingType.UTF8 })
    .then(e => {
      console.log("readAsStringAsync >>" + e);
  }).catch(err => {
    console.error(err);
  })
  FileSystem.readDirectoryAsync(directoryUri)
    .then(e => {
      console.log("readDirectoryAsync >>"+ e);
    }).catch(err => {
      console.error(err);
    })

}

await MediaLibrary.requestPermissionsAsync()

Error: This file type is not supported yet

export async function exportMdFile(filename,content){
  const directoryUri = FileSystem.cacheDirectory + 'SimpleMarkdown/'
  const fileUri = directoryUri + filename

  await FileSystem.makeDirectoryAsync(directoryUri, { intermediates: true })
    .then(e=>{
      console.log("makeDirectoryAsync" + e);
  }).catch(err =>{
    console.error(err);
  })

  await FileSystem.writeAsStringAsync(fileUri, content, { encoding: FileSystem.EncodingType.UTF8 })
    .then(e => {
      console.log("writeAsStringAsync >>" + e);
    }).catch(err => {
      console.error(err);
    })

  await FileSystem.readAsStringAsync(fileUri, { encoding: FileSystem.EncodingType.UTF8 })
    .then(e => {
      console.log("readAsStringAsync >>" + e);
  }).catch(err => {
    console.error(err);
  })
  await FileSystem.readDirectoryAsync(directoryUri)
    .then(e => {
      console.log("readDirectoryAsync >>"+ e);
    }).catch(err => {
      console.error(err);
    })

  const shareUrl =await FileSystem.getContentUriAsync(fileUri)
  console.log(shareUrl);
  Share.share({url:shareUrl})
    .then(e => {
      console.log(Share.sharedAction);
    }).catch(err => {
      console.error(err);
    })

}

encodeURIComponent(removeMarks(filename))

function removeMarks(filename) {
  const marks = ["\\", '/', ':', '*', '?', 'a', "<", ">", '|', /^ */g, /^　*/g];
  let filename_removeMarks = filename;
  for (const i in marks) {
    filename_removeMarks = filename_removeMarks.replaceAll(marks[i], '')
    }
  return(filename_removeMarks);
  }

warn Calling react-native link [packageName] is deprecated in favor of autolinking. It will be removed in the next major release.
Autolinking documentation: https://github.com/react-native-community/cli/blob/master/docs/autolinking.md

export async function fileSelect(){
  const data = await DocumentPicker.getDocumentAsync()
  console.log(data);
  }

async function fileSelect() {
  const filedata = await FS.fileSelect()
  const filecontent = filedata.filecontent
  const filename = filedata.filename

  setDataKey(null)
  setTextInput('')
  setFileName('')

  const key = 'SimpleMD' + data.length + 1

  saveFileData()
}

async function fileSelect() {
  const filedata = await FS.fileSelect()
  const filename = filedata.filename
  const filecontent = filedata.filecontent
  const key = 'SimpleMD' + (data.length + 1)

  setFileData(key, filename, filecontent)
  saveFileData(filecontent, key, filename)
}

export async function removeData(fileData){
  storage.remove(fileData)
    .then(e => {
      console.log("removeData >>" + e);
    }).catch(err => {
      console.log(fileData);
      console.error("removeData >>" + err);
    })
}

<Text style={styles.filelistText} onPress={props.removeData({key:key})>

dataList.map(async e =>{
  const name = e.name
  const content = e.text
  const fileUri = cacheDirectoryUri + encodeURIComponent(removeMarks(name))

  await FileSystem.makeDirectoryAsync(cacheDirectoryUri, { intermediates: true })
    .then(e => {
      console.log("makeDirectoryAsync" + e);
    }).catch(err => {
      console.error(err);
    })

  await FileSystem.writeAsStringAsync(fileUri, content, { encoding: FileSystem.EncodingType.UTF8 })
    .then(e => {
      console.log("writeAsStringAsync >>" + e);
    }).catch(err => {
      console.log(fileUri);
      console.error("writeAsStringAsync >>" + err);
    })
Share.share({ url: cacheDirectoryUri })
  .then(e => {
    console.log(Share.sharedAction);
  }).catch(err => {
    console.error(err);
  })
}