如何将 CSV 读入 React Native 状态数组？

IT技术 reactjs csv react-native
2021-05-20 01:54:28

我有一个问题：如何将数据从 CSV 加载到 React 中的数组中——特别是在 this.state 中作为对象。

假设我从这个开始，其中状态只是硬编码值。

export default class App extends Component<{}> {
  constructor(props) {
    super(props);
    this.state = {
      cards: [
        {itemname: 'Item 1',
          restoname: 'Resto 1',
          url: 'https://res.cloudinary.com/grubhub/image/upload/v1515191165/bkf4niv9okipbc8y6o8h.jpg',
          description: 'Desc 1'},
        {itemname: 'Item 2',
          restoname: 'Resto 2',
          url: 'https://res.cloudinary.com/grubhub/image/upload/v1514060352/twhriy3hvbzayktrjp91.jpg',
          description: 'Desc 2'}
      ]
    };
  }

有没有办法让我从数据像这样的 CSV 读取数据？

在此处输入图片说明

感谢大家！

2个回答

试试这个 npm 包。这将帮助您转换csv为json您可以在react组件中轻松使用的内容 - https://www.npmjs.com/package/csvtojson

import csv from 'csvtojson';
const csvFilePath='<path to csv file>';
csv()
.fromFile(csvFilePath)
.on('json',(jsonObj)=>{
    // combine csv header row and csv line to a json object
    // jsonObj.a ==> 1 or 4
})
.on('done',(error)=>{
    console.log('end')
})

我认为您不能csvtojson在 React Native 环境中使用 。
它适用于节点，但不适用于 Expo，我认为对于 RN 也是如此。

如果您只需要本地数据，则将 CSV 转换为 JSON 并导入。不需要额外的库。
我认为这是最简单的。

https://stackoverflow.com/a/59746430/1593212

其它你可能感兴趣的问题
上一篇在 Github Pages 上使用 Parcel 构建部署 React 应用程序 下一篇在reactJS中转换嵌套的json对象？