0

I have this simple React examle. Show data in React from API:

import React, { useEffect, useState } from "react";
const UsingFetch = () => {
  const [users, setUsers] = useState([])

  const fetchData = () => {
    console.log('fetching');
    fetch("https://jsonplaceholder.typicode.com/users")
      .then(response => {
        return response.json()
      })
      .then(data => {
        console.log(data);
        setUsers(data)
      })
  }

  useEffect(() => {
    fetchData()
  }, [])

  return (
    <div>
      {users.length > 0 && (
        <ul>
          {users.map(user => (
            <li key={user.id}>{user.name}</li>
          ))}
        </ul>
      )}
    </div>
  )
}

export default UsingFetch

Why is in console twice: fetching and data from console.log?

motorcb
  • 1,043
  • 3
  • 10
  • 19
  • it could be related to this https://stackoverflow.com/questions/72489140/react-18-strict-mode-causing-component-to-render-twice – Bruno Viera Sep 07 '22 at 16:54

0 Answers0