如何在我的 js 代码中使用这个本地 .txt 文件？

Question

我已成功使用 MechanicalSoup（Python 库）从我学校的网站上抓取数据并创建了两个 .txt 文件（upcomingFixturesData.txt 和 resultsFixturesData.txt)，我想用它来填充我的 table 之一的内容（我将 Gatsby 用作单页站点）。 .txt 文档都如下所示：

22/03/2022
4:15pm
曲棍球
Hockey v SchoolName: U16 (a, 下午3点出发)

22/03/2022
10:00am
五人组
全国五人制锦标赛：U18（校名，上午 9 点出发）

22/03/2022
4:00pm
篮球
投球：毕业生 v 公共休息室 (h)

目前，我的 js 代码正在为运动使用虚拟数据 tables:

export default function SportsSection() {
  return (
    <Wrapper>
      <RowWrapper>
        <Description>Fixtures</Description>
        <Row
          number="1"
          title="Football"
          subtitle="Boys' U14 A and B team v SchoolName (away, leave at 12:20pm)"
          time="14:30"
        />
        <Row
          number="2"
          title="Hockey"
          subtitle="Hockey v SchoolName: U16 and 2st XI (away, depart 2.00pm)"
          time="15:45"
        />
        <Row
          number="3"
          title="Netball"
          subtitle="Netball: A and B team v SchoolName (home)"
          time="16:20"
        />
        <Row
          number="4"
          title="Rowing"
          subtitle="J15 vs SchoolName (Location)"
          time="15:30"
        />
      </RowWrapper>
    </Wrapper>
  )
}

我做了一个类似的table来显示每个学生的时间table，这更容易，因为它已经是一个.json文件，而且我是可以使用 'map':

export default function TimetableSection() {
  const data = require("../../data/scraped/timetableWeekData.json")

  var days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]
  var d = new Date()
  var dayName = days[d.getDay()]
  var tmrName = days[d.getDay() + 1]

  var hrs = new Date().getHours()

  const todayData = data.events.filter(
    // event => event["start-date-display"] == "Today"
    event => event.description.includes(hrs <= 20 ? dayName : tmrName)
  )

  return (
    <Wrapper>
      <RowWrapper>
        <Description>Timetable {hrs <= 20 ? "Today" : "Tomorrow"}</Description>
        {todayData.map((item, index) => (
          <Row
            number={index + 1}
            title={item.subject}
            color={item.colour}
            subtitle={item.chairperson + ", " + item.location}
            time={item.starttime}
          />
        ))}
      </RowWrapper>
    </Wrapper>
  )
}

有什么方法可以映射 .txt 文件以填充我的每个 table 行，否则，我还能如何使用这些数据 (在我的 javascript 代码中的项目文件系统中？

非常感谢您的提前帮助！

Answer 1

就是这样，但是有了这个功能，你的txt需要正确的结构才能映射

const fs = require("fs");
const _ = require("lodash");

const fileTxt = fs.readFileSync("./test.txt", { encoding: "utf-8" });

const eachData = fileTxt.split(/^\r\n/gm); // split for each object

const resultArr = [];
let number = 0;
eachData.forEach((data) => {
  const arrOneData = data.split(/\r\n/gm); // split for each object property
  resultArr.push({
    number,
    date: arrOneData[0],
    time: arrOneData[1],
    title: arrOneData[2],
    subtitle: arrOneData[3],
  });
  number += 1;
});

console.log("resultArr", resultArr);

// resultArr [
//   {
//     number: 0,
//     date: '22/03/2022',
//     time: '4:15pm',
//     title: 'Hockey',
//     subtitle: 'Hockey v SchoolName: U16 (a, leave at 3.00pm)'
//   },
//   {
//     number: 1,
//     date: '22/03/2022',
//     time: '10:00am',
//     title: 'Fives',
//     subtitle: 'Fives National Championships: U18 (SchoolName, leave at 9.00am)'
//   },
//   {
//     number: 2,
//     date: '22/03/2022',
//     time: '4:00pm',
//     title: 'Netball',
//     subtitle: 'Netball: Leavers v Common Room (h)'
//   }
// ]

如何在我的 js 代码中使用这个本地 .txt 文件？

How can I use this local .txt file in my js code?

javascript

filesystems

parsing

file

node.js