React Native Fetch Data From Json File Example


Share:
Published By: Admin, Published On: Jun 08, 2021, Category: React Native

Hello Dev,

Now, let's see post of how to get data from json file in react native. you will learn how to fetch data from json in react native. This article goes in detailed on how to get value from json object in react native. you will learn react native read json file example.

In this post, i will give you three simple example how to get data from json file in react native..

users.json Path:assets/user.json
[
    { 
        "id":1, 
        "name": "Dharmik"
    },
    { 
        "id":2, 
        "name": "Mehul"
    },
    { 
        "id":3, 
        "name": "Keval"
    },
    { 
        "id":4, 
        "name": "Bhavesh"
    }
]
Example: 1
import React, { Component } from "react";
import {View} from 'react-native';

const MyWebtutsComponent = () => {

 const users = require("./assets/user.json");
  
  console.log(users);

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

export default MyWebtutsComponent;
Output
 Array [
    Object {
      "id": 1,
      "name": "Dharmik",
    },
    Object {
      "id": 2,
      "name": "Mehul",
    },
    Object {
      "id": 3,
      "name": "Keval",
    },
    Object {
      "id": 4,
      "name": "Bhavesh",
    },
  ],
Example: 2 App.js
import React, { Component } from "react";
import {View} from 'react-native';
import * as data from './assets/user.json';

const MyWebtutsComponent = () => {

  const rawdata = data;

  console.log(rawdata);

  return (
    <View>
    </View>
  );
};
export default MyWebtutsComponent;
Output
 Array [
    Object {
      "id": 1,
      "name": "Dharmik",
    },
    Object {
      "id": 2,
      "name": "Mehul",
    },
    Object {
      "id": 3,
      "name": "Keval",
    },
    Object {
      "id": 4,
      "name": "Bhavesh",
    },
  ],

It will help you...

Share: