useState 배열 수정

2021. 1. 15. 17:47포트폴리오/React

const { useState,useEffect } = React

const App = (props) => {

   const [memdb, setMemdb] = useState([

    {

      url: 'first',

      arr: [

        { url: 'first_1', arr: [] },

        { url: 'first_2', arr: [] }

      ]

    },

    {

      url: 'second',

      arr: [

        { url: 'second_1', arr: [] },

        { url: 'second_2', arr: [] }

      ]

    }

  ]);

  var ch = { url: "test", arr: [{inarr:"in"}] };

 

  useEffect(() => {

      console.log(memdb);

      setMemdb(memdb=>memdb.map((item,idx)=>{

         return idx==1? 

         {...item, arr: item.arr.map((item_,idx_)=>{

            return idx_==0?ch:item_

         })}

         : 

         item

      }))

  }, []);

  useEffect(() => {

      console.log("changed memdb",memdb);

  }, [memdb]);

   return (

      <>

         <h1>text</h1>

      </>

   );

}

try {

   const rootElement = document.getElementById('root')

   ReactDOM.render(<App />, rootElement)

} catch (e) { }

 

* ()=>{    } 화살표 함수 중괄호 이용 시 return 필수

'포트폴리오 > React' 카테고리의 다른 글

setState는 비동기  (0) 2020.08.25
React - 4  (0) 2020.04.02
React - 3  (0) 2020.04.02
React - 2  (0) 2020.04.02
React - 1  (0) 2020.04.02