React
-
[React] React 에서 값 넘기기FRONT-END/React 2020. 11. 4. 14:17
| src 밑에 MyName.js 파일을 하나 만들어준다. | 함수를 작성하고 MyName 이라는 이름으로 이 문서를 사용할 수 있도록 맨 밑에 export default MyName; 로 적어준다. function MyName(){ return( ) } export default MyName; | App.js 문서에서 데이터를 전송하도록 한다. import React from 'react' import logo from './logo.svg'; import './App.css'; import './css/mystyle.css' import my from './images/torikelly.png' import MyName from './MyName'; export default class App ext..
-
[React] React 에서 css 사용하기FRONT-END/React 2020. 11. 4. 13:40
| css 파일 css 폴더의 mystyle.css 을 살펴보니 클래스 . 가 있다. 그렇다면 이렇게 사용할 수 있지 않을까? import React from 'react' import logo from './logo.svg'; import './App.css'; import './css/mystyle.css' import my from './images/torikelly.png' export default class App extends React.Component{ handleDelete = () => { alert('삭제 하시겠어요?'); } handleCreate(){ console.log('handleCreate 함수'); alert('신규등록을 하시겠어요?'); } render(){ //jav..
-
[React] React 에서 함수 사용하기FRONT-END/React 2020. 11. 4. 12:19
| 기본적인 함수 사용하기 function move(dt){ let xhr='tis'; if dt >= 0 {let xhr='양수';} else {let msg = '음수';} } | 함수 이름 없이 함수 사용하기 var data = () => { //anonymous 익명의 함수 = 화살표 함수 let xhr='tis'; if dt >= 0 {let xhr='양수';} else {let msg = '음수';} } | 이벤트로 함수 호출하기 ★★★ handleDelete = () => { //anonymous 익명의 함수 = 화살표 함수 let xhr='tis'; //if dt >= 0 {let xhr='양수';} //else {let msg = '음수';} } 삭제 | 맨 마지막 줄에 export de..
-
[React] React 개발환경 구축하기FRONT-END/React 2020. 11. 4. 11:30
cd Desktop 데스크톱으로 이동하기 npx create-react-app danbi 데스크톱에 리액트관련 소스를 디렉토리 danbi 이름으로 생성 시간이 약간 소요된다 cd danbi 다 만들어졌다면 Desktop에 생성된 danbi 디렉토리로 이동 (에러) npm i react-router react-router-dom cd danbi를 하고 했어야했는데, 그렇지 않아서 에러 (에러) npm install react-router-dom cd danbi를 하고 했어야했는데, 그렇지 않아서 에러 (에러) npm i react-router-dom cd danbi를 하고 했어야했는데, 그렇지 않아서 에러 npm i react-router-dom cls 화면 지우기 C:\Users\user\Desktop\..