Javascript 读取状态响应时出现类型错误

尝试使用zebra将状态设置为json，这是由zebras读取类构造函数中的csv生成的

import "./Maps.css";
import * as z from "zebras";
import df3 from "./df3.json"

class Maps extends Component {
  constructor() {
    super();
    const data = z.readCSV(df3);
    this.state = data
}

  render()
  {
    console.log(this.state)

    return (
      <div>
      </div>
    );
  }
}

export default Maps

导入“/Maps.css”； 从“zebras”导入*作为z； 从“/df3.json”导入df3 类映射扩展了组件{ 构造函数（）{ 超级（）； const data=z.readCSV（df3）； this.state=数据 } render（） { console.log（this.state） 返回( ); } } 导出默认地图 我在尝试控制台记录状态时遇到以下错误（我已将csv转换为json并将文件导入js）

TypeError:fs\uuu网页包\u导入的\u模块\u 0\uuuuu默认值。a.readFileSync不是函数
在模块上。（readCSV.js:18）
在Module.f1（_curry1.js:16）
在新地图上（Maps.js:9）
在constructClassInstance（react dom.development.js:12905）
在updateClassComponent（react dom.development.js:17040）
开始工作时（react dom.development.js:18510）
开始工作时$1（react dom.development.js:23028）
执行工作时（react dom.development.js:22019）
在workLoopSync（react dom.development.js:21992）
在PerformSyncWorkRoot（react dom.development.js:21610）
在react dom.development.js:11130
在不稳定的情况下运行WithPriority（scheduler.development.js:656）
运行时优先级为$1（react dom.development.js:11076）
在flushSyncCallbackQueueImpl（react dom.development.js:11125）
在flushSyncCallbackQueue上（react dom.development.js:11113）
在scheduleUpdateOnFiber（react dom.development.js:21053）
在updateContainer（react dom.development.js:24191）
在legacyRenderSubtreeIntoContainer（react dom.development.js:24590）
在Object.render（react dom.development.js:24656）
在模块处../src/index.js（index.js:10）
at __;网页_;需要___;（引导：785）
在fn（引导：150）
在Object.0（index.js:12）
at __;网页_;需要___;（引导：785）
在CheckDeferredModule（引导：45）
在Array.webpackJsonpCallback[作为推送]（引导：32）
在main.chunk.js:1

如果要导入json文件（如我在代码中看到的），只需获取文件：

fetch('./data.json').then(response => {
      console.log(response);
      return response.json();
    }).then(data => {
      // Work with JSON data here
      console.log(data);
    }).catch(err => {
      // Do something for an error here
      console.log("Error Reading data " + err);
    });

然后在获取后更新您的状态。

---

希望这可以修复错误。

zebras是nodeJS的库，而不是浏览器JavaScript中的。@VP9您可能需要使用webpack插件直接导入csv以响应或将csv转换为json文件，只需从“/file.json”导入文件。。将文件移到项目的

public

文件夹中，然后使用

fetch（）请求它

。转换为json后，您不需要使用zebras，因为csv文件已被解析。问题是您仍在尝试在客户端脚本中使用服务器端库。删除对

zebras

的所有引用，然后从

console.log（df3）开始并检查输出。
fetch('./data.json').then(response => {
      console.log(response);
      return response.json();
    }).then(data => {
      // Work with JSON data here
      console.log(data);
    }).catch(err => {
      // Do something for an error here
      console.log("Error Reading data " + err);
    });