0

I'm getting an error while rendering the following component:

Too many re-renders. React limits the number of renders to prevent an infinite loop.?

import React, { useState } from 'react';
     
function My() {
  const [NAME, setValue_] = useState([{name:"",lname:""}]);  //      usestate
  let arr = [{ name: "man", lname: "Kumar" }];    //.......creating array for passing to set the value for State..
      
  setValue_(arr); //............passing array to Update data......

  console.log(NAME);   //..........Want to see updated Data....
        
  return(<> </>) //............... i didn't return anything........
}
Chris
  • 6,331
  • 1
  • 21
  • 25
WebWorld
  • 31
  • 1
  • 6
    shouldn't you be doing `setValue_` on some event. Since, JS/React runs your code line by line and you have `setValue_` in open. So, on every render you are basically calling `setValue_` which is causing infinite render issue. – Sagar More Oct 07 '20 at 08:26
  • Does this answer your question? ["Error: Too many re-renders. React limits the number of renders to prevent an infinite loop."](https://stackoverflow.com/questions/59304283/error-too-many-re-renders-react-limits-the-number-of-renders-to-prevent-an-in) – Chris Oct 07 '20 at 08:30
  • thanks bro...from heart – WebWorld Oct 07 '20 at 09:21
  • i am new in web development – WebWorld Oct 07 '20 at 09:21

1 Answers1

0

import React, { useState } from 'react';
     
function My() {
  const [name, setName] = useState([{ name: "man", lname: "Kumar" }]); 
        
  return(<>helloworld</>)
}

That's it. Just pass the array directly to the state instead of updating it later.If you really need to play it this way, then use a useEffect. Also, please keep a naming consistency. setValue doesn't relate well to name.

DoneDeal0
  • 5,273
  • 13
  • 55
  • 114