PHPFixing
  • Privacy Policy
  • TOS
  • Ask Question
  • Contact Us
  • Home
  • PHP
  • Programming
  • SQL Injection
  • Web3.0

Sunday, July 24, 2022

[FIXED] Why is the API JSON object returns false when compared to the same local object in React Native

 July 24, 2022     api, json, react-native     No comments   

Issue

I would like to compare the object that came from the API with the local object, however it shows false when I want to compare it in the console. The objects are the same. Why does comparing the same objects return false? And how can I get true?

const [QuizCategoriesData, setQuizCategoriesData] = useState([])

  const getData = async () => {
    const url = `https://eu-central-1.aws.data.mongodb-api.com/app/application-0-ekvws/endpoint/zdalneAPIHurraFajnie?secret=sekret&arg1=Expert_1`;
    const res = await fetch(url);
    const data = await res.json();
    const filterCategory = data.filter(item=> item.category === 'Mentalność bogacenia się')
    setQuizCategoriesData(filterCategory[0].data)

  };

  useEffect(() => {
    getData();
  }, []);


  const APIObject = QuizCategoriesData;
   let arr2 = [{"correct_option": "Jupiter",
    "difficulty": "easy", 
    "options": ["Jupiter", "Saturn", "Neptune", "Mercury"], 
    "question": "What’s the biggest planet in our solar system?"} ];

  console.log('api', APIObject[0])
  console.log('local', arr2[0])
  console.log('Comprasion:',JSON.stringify(APIObject[0]) === JSON.stringify(arr2[0])) //console returns false

Here are the results in a console


Resolved: Comparison function deep-diff worked for me. https://www.npmjs.com/package/deep-diff

I still don't know why the API object was different, but it's important that it works now


Solution

This is what the outcome is from the https call after applying the category filter as you have done. The data section from the https output is way larger than what you are comparing it with. Also, I will suggest you to use some comparison function instead of stringify .. here's an example of how to do that Compare objects in React Native

{
    "_id": "62a3492b2ce9f36281fc83a0",
    "category": "Mentalność bogacenia się",
    "data": [{
        "question": "What’s the biggest planet in our solar system?",
        "options": ["Jupiter", "Saturn", "Neptune", "Mercury"],
        "correct_option": "Jupiter",
        "difficulty": "easy"
    }, {
        "question": "What attraction in India is one of the famus in the world?",
        "options": ["Chand Minar", "Taj Mahal", "Stadium"],
        "correct_option": "Taj Mahal",
        "difficulty": "medium"
    }, {
        "question": "What land animal can open its mouth the widest?",
        "options": ["Alligator", "Crocodile", "Baboon", "Hippo"],
        "correct_option": "Hippo",
        "difficulty": "easy"
    }, {
        "question": "What is the largest animal on Earth?",
        "options": ["The African elephant", "The blue whale", "The sperm whale", "The giant squid"],
        "correct_option": "The blue whale",
        "difficulty": "hard"
    }, {
        "question": "What is the only flying mammal?",
        "options": ["The bat", "The flying squirrel", "The bald eagle", "The colugo"],
        "correct_option": "The bat",
        "difficulty": "medium"
    }, {
        "question": "What’s the biggest planet in our solar system?",
        "options": ["Jupiter", "Saturn", "Neptune", "Mercury"],
        "correct_option": "Jupiter",
        "difficulty": "hard"
    }, {
        "question": "What attraction in India is one of the famus in the world?",
        "options": ["Chand Minar", "Taj Mahal", "Stadium"],
        "correct_option": "Taj Mahal",
        "difficulty": "medium"
    }, {
        "question": "What land animal can open its mouth the widest?",
        "options": ["Alligator", "Crocodile", "Baboon", "Hippo"],
        "correct_option": "Hippo",
        "difficulty": "easy"
    }, {
        "question": "What is the largest animal on Earth?",
        "options": ["The African elephant", "The blue whale", "The sperm whale", "The giant squid"],
        "correct_option": "The blue whale",
        "difficulty": "medium"
    }, {
        "question": "What is the only flying mammal?",
        "options": ["The bat", "The flying squirrel", "The bald eagle", "The colugo"],
        "correct_option": "The bat",
        "difficulty": "medium"
    }]
}


Answered By - Lalit Mehra
Answer Checked By - David Marino (PHPFixing Volunteer)
  • Share This:  
  •  Facebook
  •  Twitter
  •  Stumble
  •  Digg
Newer Post Older Post Home

0 Comments:

Post a Comment

Note: Only a member of this blog may post a comment.

Total Pageviews

Featured Post

Why Learn PHP Programming

Why Learn PHP Programming A widely-used open source scripting language PHP is one of the most popular programming languages in the world. It...

Subscribe To

Posts
Atom
Posts
Comments
Atom
Comments

Copyright © PHPFixing