반응형

ReactJS 31

React와 동등한 TypeScript는 무엇입니까?PropTypes.node?

React와 동등한 TypeScript는 무엇입니까?PropTypes.node? 구석구석 찾아봤는데 React를 제외한 모든 것에 대해 TypeScript와 동등한 것을 찾을 수 있습니다.PropTypes.node. TypeScript 에는 아무것도 필요 없습니다.PropTypes, 그러나 몇 가지 있습니다.PropTypesTypeScript로 변환하는 방법을 모릅니다. 이만큼 간단한가요?var node: any이건 옳지 않은 것 같아node어떤 특성이 있는 것 같아요 사용하다React.ReactNode위해서React.PropTypes.node유형사용할 수 있습니다.JSX.ElementJSX 자체가 해결할 수 있다고 생각합니다.TypeScript for React 개발자 [ Typescript ]에서 선..

programing 2023.04.02

페이지 수 계산의 페이지 수 논리

페이지 수 계산의 페이지 수 논리 아래 소품을 통과해야 하는 반응 컴포넌트를 사용하고 있습니다. 가지고 있는 api와 같은 계산을 할 수 없습니다.total_items,것은 아니다.totalPages50개 있으면total_items, 어떻게 하면 5를 제작할 수 있을까요?totalPages소품? 내 한계는 10개래.나누다total_items타고limit값을 반올림합니다. Math.ceil(total_items/limit); 50 items / 10 per page = 5 pages 55 items / 10 per page = 6 pages 다른 페이지에 표시할 항목이 거의 없기 때문에 분할 연산에 대한 지분이 있는지 확인해야 합니다. 예를 들어 다음과 같습니다. 6 items 5 limit 만약 우리가 ..

programing 2023.04.02

연결 및 라우터 문제

연결 및 라우터 문제 프로젝트에는 Redux와 React를 사용하고 있습니다.App.js에 몇 가지 경로가 있습니다.또, 리액트 리듀스의 접속 기능도 사용하고 있습니다.업데이트 차단 문제를 방지하기 위해 보통 이 방법으로 컴포넌트를 포장했습니다. withRouter(connect(mapStateToProps, mapDispatchToProps)(App)), 단, WithRouter의 순서를 변경하여 접속해도 동작하지 않는 경우: connect(mapStateToProps, mapDispatchToProps)(withRouter(App)) App.js에 console.log 소품이 있습니다.이미 위치와 역사 소품들을 받고 있다.나는 왜 순서가 중요한지 이면에 있는 이론을 알아내고 있다.다음과 같이 사용할 ..

programing 2023.04.02

React TypeScript HoC - 컴포넌트를 프로펠러로 전달

React TypeScript HoC - 컴포넌트를 프로펠러로 전달 이 튜토리얼에 따라 https://reacttraining.com/react-router/web/example/auth-workflow 를 참조해 주세요. 코드 재생 시도 중: const PrivateRoute = ({ component: Component, ...rest }) => ( fakeAuth.isAuthenticated ? ( ) : ( ) } /> ); TypeScript의 경우: import * as React from 'react'; import { Route, RouterProps } from 'react-router'; interface Props extends RouterProps { component: React...

programing 2023.04.02

Intellissense for Jest는 VS 코드로 동작하지 않습니다.

Intellissense for Jest는 VS 코드로 동작하지 않습니다. 편집: 실행npm install @types/jest --save-dev고치다 입력하려고 합니다.it()그리고 자동 제안은isTag jsconfig.json을 추가하려고 했습니다. { "compilerOptions": { "target": "es6" }, "exclude": [ "node_modules", "assets" ] } 제안해 주셔서 감사합니다!!에 추가jsconfig.json: { "typeAcquisition": { "include": [ "jest" ] } } 이 방법으로 동작하지 않는 경우는, 다음의 커맨드로 시험해 주세요. npm install @types/jest 또는 yarn add -D @types/jest..

programing 2023.04.02

Reactjs의 미디어 쿼리 구문

Reactjs의 미디어 쿼리 구문 Reactjs에서 다음 CSS 미디어 쿼리를 수행하려면 어떻게 해야 합니까? .heading { text-align: right; /* media queries */ @media (max-width: 767px) { text-align: center; } @media (max-width: 400px) { text-align: left; } } 다음을 시도했지만 구문 오류가 발생하여 컴파일이 되지 않습니다. heading: { textAlign: 'right', @media (maxWidth: '767px') { textAlign: 'center'; } @media (maxWidth: '400px') { textAlign: 'left'; } } React 내에서 미디어 쿼..

programing 2023.04.02

Facebook React에서 코드 재사용을 위해 mixins vs components 사용

Facebook React에서 코드 재사용을 위해 mixins vs components 사용 저는 Backbone 프로젝트에서 Facebook React를 사용하기 시작했고, 지금까지는 잘 되어가고 있습니다. 하지만 리액트 코드에 중복이 섞여 있는 것을 알 수 있었습니다. 예를 들어 다음과 같은 상태를 가진 여러 양식 위젯이 있습니다.INITIAL,SENDING ★★★★★★★★★★★★★★★★★」SENT유효성이 상태가 갱신됩니다 버튼을 누르면 폼의 유효성을 확인하고 요청을 한 후 상태를 갱신해야 합니다.는 리액트 에 유지됩니다.this.state★★★★★★★★★★★★★★★★★★★★★★★★★★★ 뷰라면, 「Backbone」, 「Base Class」라고 하는 입니다.FormView하지만 내 인상은 React가..

programing 2023.03.28

React App 만들기: index.html 환경변수를 사용합니다.

React App 만들기: index.html 환경변수를 사용합니다. 예를 들어 환경변수를 주입하는 방법이 있습니까?REACT_APP_MY_API에index.html파일링? 이것에 의하면, 할 수 있지만, 나는 그것을 할 수 없을 것 같습니다. .env REACT_APP_MY_API=https://something.com index.displaces를 표시합니다. (거의) 새로운 CRA 셋업을 시도했는데, 효과가 있습니다. 서버를 다시 시작해보셨습니까?방금 당신의 예시로 테스트 변수를 변경하려고 했는데 개발 서버를 재시작하면 작동합니다. 댓글에서 지적한 바와 같이 CRA의 공식 문서에는 이에 대한 섹션이 있습니다.변수를 .env 파일에 추가할 때는 반드시 create-react-app을 재시작하십시오. ..

programing 2023.03.28

'string'은 유형 '{}'을(를) 인덱싱하는 데 사용할 수 없습니다.

'string'은 유형 '{}'을(를) 인덱싱하는 데 사용할 수 없습니다. 오브젝트 배열에서HTML 테이블을 생성하는 React 컴포넌트는 다음과 같습니다.표시할 열은 를 통해 정의됩니다.tableColumns소유물. 루프 스루시items올바른 컬럼을 표시하고 있습니다.key로부터의 재산tableColumn오브젝트({item[column.key]}). 단, typescript에서 다음 오류가 발생합니다. 형식 'string' 식을 형식 '{}'을(를) 인덱싱하는 데 사용할 수 없으므로 요소에 암시적으로 '임의' 형식이 있습니다.유형 '{}'에서 매개 변수가 'string'인 인덱스 서명을 찾을 수 없습니다. 이 문제를 해결하려면 어떻게 해야 할까요?길을 잃었어요 컴포넌트 호출 방법: 마이 컴포넌트: ex..

programing 2023.03.28

Axios - JSON 응답을 읽는 방법

Axios - JSON 응답을 읽는 방법 악시오스 0.17.1 .then(function (response) { console.log(response); //console.log(response.status); //It is an error -> SyntaxError: Unexpected token u in JSON at position 0 console.log(JSON.parse(response.data.error)); console.log(response.data.error); //undefined. 응답의 console.log는 다음과 같습니다. error": 을 입력해야 data: "{" error" : 」」 、 」」」 。 NULL 。 NULLparam} param, : ["isPipe" : pr..

programing 2023.03.23
반응형