Coding(46)
-
updateDone, app, chatting
updateDone module.exports = { HTML: function (title, body, control) { return ` ${title} ${body} ${control} `; }, table: function (topics) { var list = ""; var i = 0; while (i < topics.length) { list = list + ` ${topics[i][0]} ${topics[i][1]} ${topics[i][2]} 삭제 수정 `; i = i + 1; } list = list + ""; return list; }, Form: function (topics, url, metaData) { var form = ` `; var i = 0; console.log(topi..
2024.03.28 -
css, routing, form
Routing10_action함수1_Form태그서버전송2_예외처리_useActionData이용 import React from 'react'; import Home from './pages/Home' import Products from './pages/Products' import Root from './pages/Root'; import UsersRoot from './pages/UsersRoot'; import NewUser from './pages/NewUser'; import Error from './pages/Error'; import ProductDetails from './pages/ProductDetails'; import ProductDetails2 from './pages/Produc..
2024.03.24 -
axios, router
사용자추가1 import {useEffect, useState} from "react"; import {fetchUserList} from "./http.js" import UsersList from './components/UsersList' import Error from './components/Error'; import Box from "./components/Box.js"; export default function App() { const [usersList, setUsersList] = useState([]);//사용자 목록 const [isFetching, setIsFetching] = useState(false); //로딩중 상태저장값 const [error, setError] =useS..
2024.03.24 -
useEffect , memo
button import Button from "./components/Button"; import { createContext, useReducer,useState } from "react"; export const UserContext = createContext(null); export default function App() { const reducer = (current_state, action )=> { switch (action.type){ case "ADD": return [...current_state, action.xxx]; case "DEL": return [current_state.filter((v,i) => v !== action.xxx)]; default: return curre..
2024.03.19 -
useRef
input관리매번랜너링문제해결 import { useState, useRef } from "react"; //////////////// export default function Player() { const username = useRef(); const age = useRef(); //태그 중 ref={playerName}을 참조함 ////////////////////state와 다르게 값을 변경해도 재랜더링 되지 않고, current 속성을 사용 const [inputs, setEnterdPlayerName] = useState({username:"", age:""}); //button 을 클릭했을 때만 재랜더링 됨 , 효율적임 function handleClick() { var new_inputs..
2024.03.19 -
props
PROPS img import reactImg from './assets/exam.png'; function App() { return ( {/* public 폴더에 sample.png 붙여넣기 할것*/} ); }; export default App; PROPS index.js 에서 막으면 결과가 출력 한번만 됨 import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App.js'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.getElementByI..
2024.03.17