BeomBeomJoJo

2023/04/20 (2)

[react] react 에서 배열 데이터 삭제하기

웹 프로그래밍/React 범범조조 2023. 4. 20. 20:28

참고 https://dev.to/collegewap/how-to-delete-an-item-from-the-state-array-in-react-kl 개요 react 에서 Button 컴포넌트 하나를 추가 후, 해당 버튼을 클릭하면 데이터가 하나씩 삭제되어 화면에 출력되는 코드를 작성해 봅니다. 리액트 프로젝트 생성 먼저 리팩트 프로젝트를 생성합니다. npx create-react-app myapp 위 명령어를 통해 프로젝트 생성을 할 수 있습니다. App.js 코드 작성 위에서 CRA 로 리액트 프로젝트가 성공적으로 생성되었다면, 기본으로 App.js 파일이 생성됩니다. 해당 코드를 아래와 같이 작성해 줍니다. import { useState } from "react"; function App() { ..

더 읽기

[react] Button 클릭 시, 데이터 추가하기

웹 프로그래밍/React 범범조조 2023. 4. 20. 20:27

개요 react 에서 Button 컴포넌트 하나를 추가 후, 해당 버튼을 클릭하면 데이터가 하나씩 추가되어 화면에 출력되는 코드를 작성해 봅니다. 리액트 프로젝트 생성 먼저 리팩트 프로젝트를 생성합니다. npx create-react-app myapp 위 명령어를 통해 프로젝트 생성을 할 수 있습니다. App.js 코드 작성 위에서 CRA 로 리액트 프로젝트가 성공적으로 생성되었다면, 기본으로 App.js 파일이 생성됩니다. 해당 코드를 아래와 같이 작성해 줍니다. import "./App.css"; import { useState } from "react"; function App() { const array = [ { id: 1, name: "Alice" }, { id: 2, name: "BoBo" ..

더 읽기

Copyright © BeomBeomJoJo All Rights Reserved

Designed by JB FACTORY

티스토리툴바