[React] Export(내보내기) 및 Import(가져오기)

1. Export (내보내기)

export default [변수명]

 

• 변수 2개 Export 하고 싶을 때

let name = 'Kim';
let name2 = 'Park';

export { name, name2 }

---

2. Import(가져오기)

import [변수명] from [경로]

 

• 변수 2개 Import 하고 싶을 때

import { name, name2 } from './data.js';

---

3. [src] - [data.js]에 있는 데이터를 [App.js]로 가져오기

* data.js에 데이터 작성하기

export default [
    {
        id : 0,
        title : "Black Jacket",
        content : "Born in Paris",
        price : 6000000
    },

    {
        id : 1,
        title : "White Bag",
        content : "Born in Paris",
        price : 5000000
    },

    {
        id : 2,
        title : "Black Bag",
        content : "Born in Paris",
        price : 4000000
    },
]

---

* App.js에 import 하기

import data from './data.js';

---

* useState()에 데이터 넣기

let [products, setProducts] = useState(data);

 

* 이후는 products를 가지고 데이터 출력하거나 setProducts()로 데이터 변경하기