lastmemo

경고: 실패한 propType: 잘못된 prop 'component'가 'Route'에 제공됨 새로운 리액트 라우터 1.0.0을 사용하려고 하는데 설명할 수 없는 이상한 경고가 표시됩니다. 경고: 실패한 propType: 잘못된 prop 'component'가 'Route'에 제공되었습니다. 경고:"Route"에 제공된 정의되지 않은 "component"가 잘못되었습니다. 앱은 간단합니다. import React from 'react'; import ReactDOM from 'react-dom'; import { Router, Route } from 'react-router'; import App from './components/app'; var Speaker = require('./components..

응답 데이터 요청 내용이 검사기 캐시에서 제거되었습니다. Axios Request를 통해 (15mb) 크기의 파일을 서버에서 가져오려고 합니다.인스펙션의 네트워크 미리보기에서 상태 "200"이 표시되지만 파일 previewData(base64)가 전송되지 않고 "응답 데이터 요청 내용을 인스펙터 캐시에서 로드하지 못했습니다"라는 오류가 표시됩니다.정상적으로 검색된 2, 3 MB 파일을 얻었을 때.큰 응답을 캡처하기 위한 솔루션은 요청을 복사하여 PowerShell이나 cURL과 같은 다른 방법으로 실행하는 것입니다. Chrome 또는 Firefox DevTools에서 요청을 마우스 오른쪽 버튼으로 클릭하고 복사를 선택한 다음 원하는 실행 방법을 선택하여 요청을 PowerShell, cURL 또는 fetc..

React propTypes: 오브젝트 오브 쉐이프? 와의 차이는 무엇입니까?PropTypes.objectOf그리고.PropTypes.shapePropTypes: // An object with property values of a certain type optionalObjectOf: PropTypes.objectOf(PropTypes.number) 대 // An object taking on a particular shape optionalObjectWithShape: PropTypes.shape({ color: PropTypes.string, fontSize: PropTypes.number }) 언제 사용하면 좋을까요?objectOf언제 사용하면 좋을까요?shape?PropTypes.objectOf..

React 구성 요소 프로펠이 변경될 때 데이터를 가져오는 방법 Translation Detail 컴포넌트는 오픈 시 ID가 전달되며, 이에 따라 클래스 컨스트럭터에서 외부 API 콜이 트리거되어 상태에 대한 데이터를 수신하고 이 데이터는 Translation Detail에 표시됩니다. //Routing: //Class: class TranslationDetail extends Component { constructor(props){ super(props); this.props.fetchTrans(this.props.params.id); } URL을 수동으로 입력하면 모두 정상적으로 동작합니다.예를 들어 다음과 같이 다음 항목을 표시하기 위해 리액트 라우터를 사용하고 싶은 경우 url이 변경되지만 api..

TypeScript 및 React-Router 4, 5, 또는 6을 사용하여 보호된 경로 또는 개인 경로를 다시 작성하려면 어떻게 해야 합니까? 저는 이 웹 사이트를TypeScript를 사용한 리액트 라우터 문서에 설명된 대로입니다.누가 나 좀 도와줄래? 리액트 라우터의 privateRoute 문서: const PrivateRoute = ({ component: Component, ...rest }) => ( ( fakeAuth.isAuthenticated ? ( ) : ( ) )}/> ) 다음은 TypeScript 버전입니다(동작하지 않습니다). const PrivateRoute = (theProps: { path: string, component: React.SFC | React.ComponentCl..

왜 사람들은 리액트/JSX에 { " }을(를) 넣을까요? 이 내용은 React 문서와 스크린캐스트에 나와 있습니다.사람들은 글을 쓸 것이다.{ " " }JSX 템플릿 안에 있습니다. 그들은 왜 이런 일을 할까?줄 바꿈의 대체 수단으로 사용하고 있는 것 같습니다만, 어디에서도 명확하게 설명되고 있지 않습니다.다른 태그가 있는 경우 컴파일/변환 시 선행 및 후행 공간은 무시되므로 텍스트 블록에 명시적 공간을 넣기 위해 사용됩니다. 예: Text some Text 으로 귀결국Textsome Text화면에 표시됩니다.(스페이스 누락 참조) Text{' '} some Text 로 원하는 결과를 얻을 수 있습니다.Text some Text화면에 표시됩니다.선행 또는 후행 공백을 추가하는 데 사용됩니다. render..

Jest transform Ignore Patterns가 작동하지 않습니다. 저는 이것에 관한 다른 질문이나 Github의 다른 프로젝트를 오랫동안 살펴보았지만, 어느 대답도 제게는 효과가 없는 것 같습니다. 프로젝트에서 서드파티 라이브러리를 로드하고 있는데 Jest 테스트 실행 시 오류가 발생합니다. export default portalCommunication; ^^^^^^ SyntaxError: Unexpected token export > 1 | import portalCommunication from 'mathletics-portal-communication-service'; 이 라이브러리를 변환하기 위해 여러 가지 방법으로 Jest 설정을 업데이트하려고 했지만 항상 같은 오류가 발생합니다. 현..

ReactJs 글로벌 도우미 기능 문제: 컴포넌트에 상주할 필요가 없는 작은 도우미 기능이 많이 있습니다(또는 컴포넌트가 많은 코드로 인해 비대해질 수 있습니다.저의 게으름뱅이는 이 모든 것을 컴포넌트가 호출할 수 있는 글로벌 기능이라고 생각하고 있습니다.정말 좋은 ReactJs 코드를 만들고 싶어요. 질문:.Reactjs의 글로벌 도우미 기능에 관한 베스트 프랙티스는 무엇입니까?어떤 컴포넌트에 강제로 넣어야 할까요, 아니면 다른 컴포넌트에 밀어 넣어야 할까요? 기본적인 예: function helperfunction1(a, b) { //does some work return someValue; } function helperfunction2(c, d) { //does some work return so..

반응 원어민에서 전역 변수/상수 React Native에서 Android Development에서처럼 사용할 모든 문자열을 글로벌 변수에 정의할 수 있는 방법이 있습니까? String.xml에서 모든 문자열을 입력할 수 있습니다.내가 한 건 지구모듈을 만든 거야 // 파일: Globals.js module.exports = { STORE_KEY: 'a56z0fzrNpl^2', BASE_URL: 'http://someurl.com', COLOR: { ORANGE: '#C50', DARKBLUE: '#0F3274', LIGHTBLUE: '#6EA8DA', DARKGRAY: '#999', }, }; 그럼 맨 위에만 있으면 되겠네요 const GLOBAL = require('../Globals'); 그렇게 접근..

React JS 응용 프로그램에 대한 소스 맵을 사용하지 않도록 설정하는 방법 리액트 폴더 구조는 다음과 같습니다. create-react-app 버전을 사용하지 않았습니다.나는 그것을 사용해봤어요.GENERATE_SOURCEMAP=false.하지만 그것은 작동하지 않았다. .map 파일은 어디서 찾을 수 있나요?그 파일들은 어떻게 삭제하나요? 빌드 폴더를 찾을 수 없습니다.아래 스크립트를 사용하려고 했지만 소스 맵을 제거할 때 작동하지 않습니다. "scripts": { "start": "react-scripts start", "build": "GENERATE_SOURCEMAP=false && npm run build", "test": "react-scripts test --env=jsdom", "eje..