选取本地文本文件并返回文件内容getFileContent

选取本地文本文件并返回文件内容

定义选取本地文本文件并返回文件内容的方法getFileContent

/**
 * 选取本地文本文件并返回文件内容
 * @returns {Promise<unknown>}
 */

export function getFileContent () {
  const accept = ['.json', '.xml']
  return new Promise((resolve, reject) => {
    const fileInput = document.createElement('input')
    fileInput.type = 'file'
    fileInput.accept = accept
    fileInput.click()
    fileInput.onchange = function (event) {
      const file = event.target.files[0]
      const reader = new FileReader()
      reader.onloadend = event => {
        if (event.target.readyState === FileReader.DONE) {
          resolve(event.target.result)
        }
      }
      reader.onerror = error => {
        console.log(error)
        reject('')
      }
      reader.readAsText(file, 'utf8')
    }
  })
}

导入方法getFileContent并使用

import { getFileContent } from "./file.js"

getFileContent()
 .then(res=>{
    console.log("读取文件内容:",res);
 })
 .catch(()=>{
    console.log("read file failed.");
 })