magicmemo

번들 유효한 메시지를 표시해도 Webpack-dev-server가 번들되지 않음 웹 팩을 사용하여 기본 리액트 응용 프로그램을 설정했지만 웹 팩을 사용할 수 없습니다.webpack-dev-server정상적으로 동작하고 있습니다. 설치 완료webpack-dev-server글로벌하게 명령어 실행을 시도했습니다.sudo webpack-dev-server --hot핫 새로고침이 필요했기 때문입니다. 이 프로젝트는 잘 진행되고 있는 것 같습니다.webpackcmd. 빌드 폴더에 내장되어 있어 일부 서버를 통해 동작할 수 있지만,webpack-dev-server터미널에서는 빌드 프로세스가 오류 없이 완료되었음을 알 수 있습니다.[webpack: bundle is now VALID.]는 실제로 적절하게 감시하고 있습..

배열을 useEffect 종속성 목록으로 전달하는 중 5초마다 긴 폴링으로 데이터가 몇 개 송신됩니다.또한 어레이의 1개 항목(또는 어레이 길이 자체)이 변경될 때마다 컴포넌트가 액션을 디스패치하도록 하겠습니다.어레이를 useEffect 의존관계로 전달할 때 useEffect가 무한 루프 상태가 되지 않도록 하려면 어떻게 해야 합니까? useEffect(() => { console.log(outcomes) }, [outcomes]) 어디에outcomes다음과 같은 ID 배열입니다.[123, 234, 3212]어레이 내의 아이템은 교환 또는 삭제될 수 있으므로 어레이의 총 길이는 동일할 수 있습니다.따라서 통과할 필요가 없습니다.outcomes.length의존성이 없기 때문입니다. outcomesresel..

BrowserRouter와 history.push()가 있는 라우터 나는 그 차이를 이해하려고 애쓰고 있다.BrowserRouter그리고.Router의react-router-dom(v5) 패키지와 아래 예제의 차이점. 문서에는 다음과 같이 기재되어 있습니다. BrowserRouter A는 HTML5 이력 API(pushState, replaceState 및 popstate 이벤트)를 사용하여 UI를 URL과 동기화 상태로 유지합니다. 출처 : https://reacttraining.com/react-router/web/api/BrowserRouter 라우터 모든 라우터 컴포넌트의 공통 로우 레벨인터페이스일반적으로 앱은 다음 중 하나의 고급 라우터를 사용합니다.BrowserRouter, HashRouter..

setState in reactjs가 Sync가 아닌 비동기인 이유는 무엇입니까? 하는 것을 했다.this.setState()임의의 컴포넌트의 함수는 비동기이거나 호출된 함수의 완료 후에 호출됩니다. 이 블로그를 검색해 보니 (setState() 상태 변환 조작이 동기 인 리액트일 수 있음)JS) 는 는 here here here here here here here here here here here here here.setState는 상태변화가 트리거된 방법에 따라 비동기(스택이 비어 있을 때 호출됨) 또는 동기(콜됨과 동시에 호출됨)입니다. 이 두 가지는 소화하기 어렵다. 블로그에서setState.updateState 무엇이 가 됐는지.updateState함수는 호출된 함수로서는 알 수 없는 것입니다..

반응의 getElementById 현재 이 오류는 다음과 같이 표시됩니다. Uncaught TypeError: Cannot read property 'value' of null 아래 렌더링 함수에서 이 기능을 호출합니다. 여기에도 전화를 걸어봤는데 componentWillMount: function(){ var name = document.getElementById('name').value; }, 입력 텍스트 필드의 ID를 가져와 해당 값을 읽고 null이 아님을 확인하려면 어떻게 해야 합니까? 요소를 읽으려고 하면 DOM이 로딩되는 것 같은데 왜 null인지 알 수 없습니다.이 기능을 사용할 필요가 있습니다.componentDidMount이것은 DOM이 로드되었을 때 호출되는 함수이기 때문에 라이프 사..

React js의 "마운팅"이란 무엇입니까? ReactJs를 배우면서 '마운트'라는 말을 너무 많이 들었어요.그리고 이 용어에는 라이프 사이클 방법과 오류가 있는 것 같습니다.마운트란 정확히 어떤 의미입니까? ::componentDidMount() and componentWillMount()React의 주요 업무는 화면에 렌더링하려는 구성요소에 맞게 DOM을 수정하는 방법을 알아내는 것입니다. React는 이를 "마운트"(DOM에 노드를 추가), "마운트 해제"(DOM에서 노드를 삭제) 및 "업데이트"(DOM에 이미 있는 노드를 변경)함으로써 수행합니다. 리액트 노드가 어떻게 DOM 노드로 표시되는지, DOM 트리의 장소와 타이밍은 최상위 API에 의해 관리됩니다.현재 상황을 더 잘 이해하려면 가장 간단..

리액트 후크 useEffect는 업데이트 시에만 적용됩니까? 제한하고 싶은 경우useEffect컴포넌트가 마운트되었을 때만 실행되도록 하려면 , 다음의 파라메타를 추가할 수 있습니다.useEffect와 함께[]. useEffect(() => { // ... }, []); 하지만 어떻게 하면useEffect초기 마운트를 제외한 컴포넌트가 업데이트되는 순간에만 실행할 수 있습니까?useEffect를 초기 마운트를 제외한 업데이트에서만 실행하려면useRefinitialMount를 추적하다useEffect두 번째 매개 변수를 사용하지 않습니다. const isInitialMount = useRef(true); useEffect(() => { if (isInitialMount.current) { isInitial..

React Js에서 CSS/Jquery calc 함수 사용 다이내믹한 폭의 설정을 할 필요가 있는 상황이 있습니다.div그래서 이걸 써야겠다divStyle = {width: calc(100% - 276px)}내 리액트 Js 코드로.그러나 그렇게 하면 오류가 발생합니다.calc is not a function. Jquery를 사용하여 이 작업을 수행할 수 있다는 것을 알지만 JQuery를 어플리케이션에 소개하고 싶지는 않습니다.이 문제를 해결할 수 있는 회피책이나 해킹이 있으면 공유해 주세요. 코드: customFormat = 'hello-div' divStyle = {width: calc(100% - 276px)} return ( Hello World ) 보다 구체적인 CSS가 필요한 경우 견적서에 기재..

최소화 없이 React의 실제 버전을 구축하는 방법은 무엇입니까? 배경 react를 사용하여 로컬 개발 환경을 설정하기 위해 공식 가이드를 거의 따라왔는데create-react-app셋업도 많이 되고요. , 이제 ★★★★★★★★★★★★★★★★★★★★★★★★★★★」npm run build모든 정보를 상세하게 볼 수 있습니다.build더입 if if if 。단, run run run run run run run run run run run run run run run run 。npm start 서비스 은 변경되지 것 .JS는 JS를 사용합니다.이데올로기 때문에 질문. 어느 쪽인가 하면, " " " " 에서 생성된 수 ?npm start 안된 것 ( )build여기서 수정되지 않습니다.) 어떻게 라도 도망칠 ..

초기 상태를 redux로 설정하는 방법 리덕스 상점의 초기 상태를 어떻게 설정할지 알아보고 있습니다.예를 들어 https://github.com/reactjs/redux/blob/master/examples/todos-with-undo/reducers/index.js을 사용하고 있습니다.todos 값이 초기화되도록 코드를 수정하려고 했습니다. const todoApp = combineReducers({ todos, visibilityFilter }, { todos: [{id:123, text:'hello', completed: false}] }) 다음 문서를 참조해 주세요. 잘 안 먹히는데 왜 그런지 모르겠어요.하기 위해서는 두 번째 논거가 되어야 한다.createStore: const rootReduc..