读取文件组件（fs.readFile）

Question

我收到一个错误，指出这fs.readFile不是一个函数。我不了解如何使用fs.readFile？https://www.geeksforgeeks.org/node-js-fs-readfile-method/这里的目标是将我的文件的内容放入一个变量中并进一步解析该值。import React from 'react';const fs = require('fs')const ToolTipTextMod = (props) => {    let txt = null;    fs.readFile('../../components/ToolTip/ToolTipText.txt',(err, data) => {console.log(data)})    return(        <p>{txt},{props.textId}</p>    );}export default ToolTipTextMod;

Answer 1

fs 是一个 Nodejs 模块。所以我建议使用像 raw-loader 这样的包，但为此你需要设置 webpack。

所以替代方法是简单地使用 fetch/Axios。

例子：

 import React, {useState,useEffect} from "react";

 import txt from "./test.txt"; // Your file path 

 import Axios from "axios"; // Import Axios or use Fetch.

const ToolTipTextMod = (props) => {

const [text,setText] = useState("");

useEffect(()=>{

   Axios(txt).then(res => setText(res.data)); // This will have your text inside data attribute

},[])

return <p>/* code */</p>

}

Answer 2

fs.readFile()适用于 NodeJs，对于前端反应，您可以使用FileReader()：

  const handleReadFile = () => {

    const reader = new FileReader();

    reader.onload = (e) => {

      const fileContents = e.target.result;

      console.log(fileContents);

      setText(fileContents);

    };

    reader.readAsText(selectedFile);

  };