반응형

ReactJS 34

"오류: 리렌더가 너무 많습니다.무한 루프를 방지하기 위해 리액트는 렌더링 수를 제한합니다."

"오류: 리렌더가 너무 많습니다.무한 루프를 방지하기 위해 리액트는 렌더링 수를 제한합니다." 안녕하세요, 리액트 함수에 갇혀 있습니다.useState훅과 useState를 배우고 싶을 뿐인데, 해결책을 찾기 위해 아무리 발버둥쳐도 진전이 없습니다.풀 리액션 기능은 다음과 같습니다. import React, { useState } from 'react'; import './MainPart.css'; function MainPart(props) { const [orderData_, setOrderData_] = useState(props.orderData); let topicData_ = props.topicData; let titleData_ = props.titleData; let infoData_ =..

programing 2023.03.05

NextJS - 동적 경로에 쿼리 매개 변수 추가

NextJS - 동적 경로에 쿼리 매개 변수 추가 내 NextJS 앱에는 모든 페이지에 표시되는 언어 선택기가 있습니다.새 언어를 선택할 때 쿼리 매개 변수를 추가하여 현재 URL을 바꾸기만 하면 됩니다.lang=en하게. 다음은 URL을 대체하는 기능입니다. const changeLanguage = (lang: LanguageID) => { replace({ pathname, query: { ...query, lang }, }); }; 이 예에서는,replace,query그리고.pathname는 다음 라우터에서 송신됩니다. 현재 모든 것이 스태틱루트에서는 동작하지만 다이내믹루트에서는 동작시킬 수 없습니다.예를 들어 다음과 같은 폴더 구조를 가지고 있습니다. pages |_customers |__inde..

programing 2023.02.28

TypeScript 오류: 유형 'ReactNode'에 'children' 속성이 없습니다.

TypeScript 오류: 유형 'ReactNode'에 'children' 속성이 없습니다. export const PageViewTracker = ({ children }: ReactNode): ReactElement => { usePageView(); return children; }; 문제: 이 함수는 "Property 'children' is not exist on 'ReactNode'" 오류를 반환합니다. 솔루션에 대한 나의 접근법: 여러 가지 시도를 해봤지만 내가 원하는 작품이 아닌 작품만 시도했다.평소에는 어린이 소품용으로 React Node를 사용했는데 잘 작동했어요.이 경우 TypeScript에 문제가 있는 것 같습니다.반응 > = 18 리액트 18에서는FunctionalComponent..

programing 2023.02.28

중복된 식별자 'LibraryManagedAttributes'

중복된 식별자 'LibraryManagedAttributes' 다음과 같은 문제가 있습니다. 반응 형식 스크립트(2312,14): 중복된 식별자 'LibraryManagedAttributes' 그리고. TypeScript 오류:중복된 식별자 'LibraryManagedAttributes' 하지만 해결책을 찾을 수가 없어요. 이미 최신 node/npm/yarn/typescript 버전으로 업그레이드했습니다.다운그레이드도 시도했다.아무것도 도움이 안 돼요. yarn build --verbose yarn run v1.9.4 $ react-scripts-ts build --verbose Creating an optimized production build... Starting type checking and l..

programing 2023.02.28

ES2015 모듈 구문은 커스텀 TypeScript 모듈 및 네임스페이스 @typescript-eslint/no-namespace보다 선호됩니다.

ES2015 모듈 구문은 커스텀 TypeScript 모듈 및 네임스페이스 @typescript-eslint/no-namespace보다 선호됩니다. npm start 실행 중 다음 오류가 발생하였습니다. ES2015 모듈 구문은 커스텀 TypeScript 모듈 및 네임스페이스 @typescript-eslint/no-namespace보다 선호됩니다. namespace InternalThings {...} 제가 이걸 조사하려고 했는데 너무 헷갈려요. 왜 이런 일이 일어나는 거죠?어떻게 고치죠? tsconfig.json에 플래그를 붙이려고 했지만 아직 성공하지 못했습니다.이는 보풀 규칙에 의해 발생하는 보풀 오류입니다.https://github.com/typescript-eslint/typescript-esli..

programing 2023.02.28

버튼 색상 변경 원어민 반응

버튼 색상 변경 원어민 반응 버튼의 색상을 간단하게 변경하고 싶은데 변경할 수 없습니다.버튼을 직접 변경하여 스타일을 전달하려고 했습니다.하지만 둘 다 효과가 없었다.여기 아주 간단한 코드가 있습니다. export default class Dots extends Component { render() { return ( ); } } const styles = StyleSheet.create({ container: { flex:1, backgroundColor:'transparent', resizeMode:'cover', justifyContent:'center', alignItems:'center', width:null, height:null }, button:{ backgroundColor:'#ff5c5..

programing 2023.02.28

반응 네이티브 버튼의 배경색을 변경하는 방법

반응 네이티브 버튼의 배경색을 변경하는 방법 버튼의 배경색을 변경하려고 하는데, 아무것도 작동하지 않는 것 같습니다.올려진 속성을 사용해보니 잘못 사용하고 있는 것 같습니다.생각나는 사람 있어요? import React from 'react'; import { StyleSheet, Text, View, Button, TouchableHighlight } from 'react-native'; export default class App extends React.Component { state={ name: "Mamadou" }; myPress = () => { this.setState({ name: "Coulibaly" }); }; render() { return ( ); } } const styles =..

programing 2023.02.28

Jest를 사용하여 메서드 호출을 감시하려면 어떻게 해야 합니까?

Jest를 사용하여 메서드 호출을 감시하려면 어떻게 해야 합니까? 최근에 어떤 커스텀 메서드가 조건부로 호출되는 것을 테스트하고 싶었습니다.componentDidMountReact 컴포넌트의 메서드. componentDidMount() { if (this.props.initOpen) { this.methodName(); } } Jest를 테스트 프레임워크로 사용하고 있습니다.이거는 다음을 포함합니다.jest.fn()모크/모크용.Sinon을 사용하여 테스트하는 것은 다음과 같은 간단한 작업이라고 합니다. sinon.spy(Component.prototype, "methodName"); const wrapper = mount(); expect(wrapper.instance().methodName).toHav..

programing 2023.02.23

심판에게 소품을 건네는 적절한 방법은 무엇입니까?

심판에게 소품을 건네는 적절한 방법은 무엇입니까? 구성 요소의 참조를 다른 구성 요소에 전달하려고 합니다.문자열 참조가 권장되지 않기 때문에 콜백 참조를 사용하고 있습니다. 이것과 비슷한 것이 있습니다. this.one = c}/> 문제는 제가 이 컴퓨터에 접속하려고 할 때마다this.props.one안에서.Two나는 이해한다undefined. 이거 입어보기도 했어요.Two: componentDidMount(){ setTimeout(()=>{ console.log(this.props.one); },5000) } 문제는 소품 작성 시 참조가 한 번 작성되기 때문에 아직 존재하지 않는 것 같습니다.One탑재되어 있습니다.하지만 어떻게 소품들을 새로 고쳐야 할지 모르겠어요Two장착 구성 요소에 참조를 전달합니..

programing 2023.02.15

React에서 페이지 번호부여를 구현하는 방법

React에서 페이지 번호부여를 구현하는 방법 저는 ReactJs에 익숙하지 않고 간단한 TODO 어플리케이션을 만들고 있습니다.실제로 DB 연결이 없는 매우 기본적인 앱으로 작업이 배열에 저장됩니다.편집 및 삭제 기능을 추가했습니다.페이지 매김을 추가하겠습니다. 어떻게 구현해야 합니까?어떤 도움이라도 주시면 감사하겠습니다.감사합니다.!!최근 Pure React JS에서 페이지네이션(pagnation)을 구현했습니다.여기 작업 데모가 있습니다.http://codepen.io/PiotrBerebecki/pen/pEYPbY 물론 로직과 페이지 번호가 표시되는 방법을 조정하여 요건을 충족시켜야 합니다. 풀코드: class TodoApp extends React.Component { constructor() {..

programing 2023.02.15
반응형