Накачать данные в FlatList из переменной React-Native - PullRequest
Новая
       19

Накачать данные в FlatList из переменной React-Native

1 голос
/ 02 мая 2019

Я храню файл JSON в локальном хранилище с использованиемact-native-fs и извлечение данных из файла JSON и сохранение их в переменной.

Я хочу получить данные, хранящиеся в переменной, и накачать их в FlatList.

Я пытался 

// getting data from the local file
var path = RNFS.DocumentDirectoryPath + '/test.json';
return RNFS.readFile(path, 'utf8')
  .then((success) => {
      console.log(success);//Data is storing successfully see console output below
      this.setState({        
      isLoading: false,
      dataSource: success.recordset //data is not getting separated with respect to recordset 
    });
    console.log(dataSource);//see outpout below
  })
  .catch((err) => {
    console.log(err.message);
  });

console.log (успех) вывод

[{"набор записей": [[{"id": 1, "UPRN": 552, "SiteName": "Здание муниципалитета", "DueDate": "2019-04-26T00: 00: 00.000Z", "SurveyStatus": "Завершено", "SyncStatus": "Завершено"}, {"id": 2, "UPRN": 554, "SiteName": "Зал округа 2", "DueDate": "2019-03-01T00 : 00: 00.000Z "," SurveyStatus ":" Завершено "," SyncStatus ":" выполняется синхронизация "}, {" id ": 3," UPRN ": 1524," SiteName ":" Зал округа 3 " "DueDate": "2019-03-02T00: 00: 00.000Z", "SurveyStatus": "Обзор незавершенного", "SYNCSTATUS": нулевой}, { "ID": 4, "UPRN": 2546, "SiteName": "Зал округа 4", "DueDate": "2019-03-15T00: 00: 00.000Z", "SurveyStatus": null, "SyncStatus": null}, {"id": 5, "UPRN" : 2156, "SiteName": "Зал округа 5", "DueDate": "2019-07-01T00: 00: 00.000Z", "SurveyStatus": null, "SyncStatus": null}, {"id": 6, "UPRN": 8945, "SiteName": "Здание муниципалитета 6", "DueDate": "2019-06-01T00: 00: 00.000Z", "SurveyStatus": null, "SyncStatus": null}, {"id" : 7, "UPRN": 5214, "SiteName": "Hall Hall 7", "DueDate": "2020-06-01T00: 00: 00.000Z", "SurveyStatus": null, "SyncStatus": null}]]

console.log (dataSource) вывод

источник данных не определен

Плоский код 

    <FlatList
      data={this.state.dataSource}
      renderItem={({item}) =>
      <View style={styles.flatview}>
        <Text style={styles.name}>{item.UPRN}</Text>
        <Text style={styles.email}>{item.SiteName}</Text>
        <Text style={styles.email}>{item.DueDate}</Text>
        <Text style={styles.email}>{item.SurveyStatus}</Text>
        <Text style={styles.email}>{item.SyncStatus}</Text>
      </View>
      }
      keyExtractor={item => item.id}
    />

Как мне раздуть эти данные в FlatList относительно id?

Ответы [ 2 ]

0 голосов
/ 02 мая 2019

Просто сделайте это как 


var path = RNFS.DocumentDirectoryPath + '/test.json';
return RNFS.readFile(path, 'utf8')
  .then((success) => {
      console.log(success);//Data is storing successfully see console output below

   const dataSource = success[0].recordset[0]

 this.setState({        
      isLoading: false,
      dataSource
    });
    console.log(dataSource);//see outpout below
  })
  .catch((err) => {
    console.log(err.message);
  });

ошибка в том, что вы используете источник данных и он не определен.вам нужно определить переменную, которую вы используете.

и попробуйте отформатировать массив json в 

{"recordset":[{"id":1,"UPRN":552,"SiteName":"County Hall","DueDate":"2019-04-26T00:00:00.000Z","SurveyStatus":"Completed","SyncStatus":"Completed"},{"id":2,"UPRN":554,"SiteName":"County Hall 2","DueDate":"2019-03-01T00:00:00.000Z","SurveyStatus":"Completed","SyncStatus":"sync-in-progress"},{"id":3,"UPRN":1524,"SiteName":"County Hall 3","DueDate":"2019-03-02T00:00:00.000Z","SurveyStatus":"Survey-in-progress","SyncStatus":null},{"id":4,"UPRN":2546,"SiteName":"County Hall 4","DueDate":"2019-03-15T00:00:00.000Z","SurveyStatus":null,"SyncStatus":null},{"id":5,"UPRN":2156,"SiteName":"County Hall 5","DueDate":"2019-07-01T00:00:00.000Z","SurveyStatus":null,"SyncStatus":null},{"id":6,"UPRN":8945,"SiteName":"County Hall 6","DueDate":"2019-06-01T00:00:00.000Z","SurveyStatus":null,"SyncStatus":null},{"id":7,"UPRN":5214,"SiteName":"County Hall 7","DueDate":"2020-06-01T00:00:00.000Z","SurveyStatus":null,"SyncStatus":null}]}

, потому что вы обращаетесь к неправильной переменной

0 голосов
/ 02 мая 2019

Здесь происходит несколько вещей.

Во-первых, ваше сообщение dataSource is not defined связано с тем, что оператор console.log выходит за рамки результата RNFS.readFile.

Во-вторых, вам нужно проанализировать JSON для преобразования содержимого файла json в объекты, например: 

JSON.parse(success).then(result => this.setState({dataSource, result[0].recordset})

В-третьих, похоже, что recordset находится в массиве, поэтому на него ссылаются как result[0].recordset.

...