Hello I want to parse Json data from a JSON file in local Machine . Here is My code var data_local = require("../data/StudentList.json"); I want check console what I m getting but I get Network failure can you please give me full example how to get Json parse from local file in React native . Here is my another line of code console console.log(data_local);
Add a comment
|
2 Answers
Please try adding below code:
Your Json code within the "StudentList.json" file will be like this:
[{"id": 1,"name": "Student1"},
{"id": 2, "name": "Student2"},
{"id": 3, "name": "Student3"},
{"id": 4, "name": "Student4"},
{"id": 5, "name": "Student5"},
{"id": 6, "name": "Student6"},
{"id": 7, "name": "Student7"},
{"id": 8, "name": "Student8"},
{"id": 9, "name": "Student9"},
{"id": 10, "name": "Student10"}]
Your code for accessing json data will be like this:
import React, { Component } from 'react';
import { View, Text, FlatList} from 'react-native';
import studentList from '../data/StudentList.json';
class DemoApp extends Component {
render() {
return (
<View style={{flex: 1, flexDirection: 'column'}}>
<Text >
Student List
</Text>
<FlatList
data={studentList}
showsVerticalScrollIndicator={false}
renderItem={({item}) =>
<View >
<Text>{item.name}</Text>
</View>
}
keyExtractor={(item, index) => index.toString()}
/>
</View>
);
}
}
export default DemoApp;
7 Comments
Rifat Murtuza
How I use View in Li
Rifat Murtuza
Here my code for local JSON data import data_local from "../data/StudentList.json"; <ul> {data_local.map(function(studentData) { return ( <li> <View> {studentData.Roll} - {studentData.name} </View> </li> ); })} </ul>
Sandy.....
@Rifat Murtuza, may I know how do you want to display the data(i.e. possible UI )?
Rifat Murtuza
in <View></View> probalbly it will best for me if you can help me with listview or flatlist
Sandy.....
@Rifat Murtuza, I have updated an answer. Please go through it. Hope it will help you.
|
your json file should look like eg:
Demo.json
{"name":"Rifat"}
import json file in this way
import Demo from './demo.json'
console.log(Demo) //output: { name: 'Rifat' }
