반응형

reactjs 37

반응 구성요소의 iframe 내용 설정 방법

반응 구성요소의 iframe 내용 설정 방법 React 컴포넌트에서 iframe의 내용을 설정하려고 하는데 설정할 수 없습니다.iframe 로드가 완료되면 호출해야 하는 함수를 포함하는 컴포넌트가 있습니다.그 기능에서 콘텐츠를 설정하고 있습니다만, 온로드 기능이 전혀 호출되지 않는 것 같습니다.Chrome 브라우저로 테스트하고 있습니다.다음을 시도하고 있습니다. var MyIframe = React.createClass({ componentDidMount : function(){ var iframe = this.refs.iframe.getDOMNode(); if(iframe.attachEvent){ iframe.attacheEvent("onload", this.props.onLoad); }else{ if..

programing 2023.03.12

"JSX 요소에 암묵적으로 "임의" 유형의 오류가 있습니다."를 해결하는 방법

"JSX 요소에 암묵적으로 "임의" 유형의 오류가 있습니다."를 해결하는 방법 타이핑 라이브러리를 인스톨 해 참조하고 있습니다만, 이렇게 「반응」 /// 다음과 같은 에러가 아직 표시됩니다. 다른 타이핑 라이브러리도 설치해야 하나요?VSCode를 다시 로드하여 이 문제를 해결했습니다. Ctrl++ShiftP - 또는 - ++shiftP 그런 다음 다음과 같이 입력합니다.Developer: Reload Window리액트 타입 정의를 인스톨 하고, 이 문제를 해결했습니다. 도망가려고 하다yarn add --dev @types/react타이핑에서 사용할 수 있는 리액트 버전은 두 가지가 있습니다.나는 이 문제를 본 적이 있다.typings install react및 사용noImplicitAny. 글로벌 버전을..

programing 2023.03.12

파라미터를 사용하여 useCallback 응답

파라미터를 사용하여 useCallback 응답 리액트 사용useCallback훅은 본질적으로 그냥 감싸는 것이다useMemo컴포넌트의 소품 내에 새로운 기능 인스턴스가 지속적으로 생성되지 않도록 하는 기능에 특화되어 있습니다.이 질문은 메모화로 작성된 콜백에 인수된 내용을 전달할 필요가 있는 경우입니다. 예를 들어, 콜백은 이렇게 작성됩니다. const Button: React.FunctionComponent = props => { const onClick = React.useCallback(() => alert('Clicked!'), []) return {props.children} } 는 메모화된 콜백의 단순한 예이며 작업을 수행하기 위해 외부 값이 전달되지 않습니다.단, 일반적인 메모화된 콜백을 작..

programing 2023.03.12

반응 - TypeScript 및 기능 컴포넌트와 함께 useRef

반응 - TypeScript 및 기능 컴포넌트와 함께 useRef 부모 컴포넌트에서 자식 컴포넌트 메서드를 호출하려고 합니다.useRef. 장차SayHi메서드는 하위 구성 요소의 후크 상태를 업데이트합니다.유감스럽게도, 저는 처리할 수 없는 버그가 있습니다. 회선:ref.current.SayHi(); 속성 'SayHi'가 유형 'ForwardRefExotic Component '에 없습니다. 회선: 'RefObject void ; } | RefObject = > 를 입력합니다.유형에는 '({ SayHi: ( ) = > ) > ) | Refoid >..

programing 2023.03.07

반응 - 디버깅을 위해 DOM 요소에서 구성 요소를 가져옵니다.

반응 - 디버깅을 위해 DOM 요소에서 구성 요소를 가져옵니다. 콘솔에서 디버깅하기 위해 React에서 DOM 요소 인스턴스를 사용하여 백업 React 구성 요소를 가져올 수 있는 메커니즘이 있습니까? 이 질문은 이전에 프로덕션 코드에서 사용한다는 맥락에서 질문한 바 있습니다.다만, 디버깅을 목적으로 한 개발 빌드에 초점을 맞추고 있습니다. React용 Chrome 디버깅 확장에 대해 잘 알고 있지만 일부 브라우저에서는 사용할 수 없습니다.DOM 탐색기와 콘솔을 결합하면 '$0' 바로 가기를 사용하여 강조 표시된 DOM 요소에 대한 정보에 쉽게 액세스할 수 있습니다. 디버깅 콘솔에 getComponentFromElement(0달러).props와 같은 코드를 쓰고 싶습니다. React 개발 빌드에서도 요소..

programing 2023.03.07

HTML을 렌더링하지 않고 React를 사용할 수 있습니까?

HTML을 렌더링하지 않고 React를 사용할 수 있습니까? html을 렌더링하지 않고 리액트를 사용하여 로직을 수행하고 javascript 함수로 데이터를 돌려보낼 수 있는지 궁금합니다.제가 생각하고 있는 컴포넌트는 데이터를 주고받는 것입니다.이 컴포넌트는 반응 이외의 Javascript 함수로 데이터를 되돌립니다.할 수 있다는 것을 알고 있고, 저도 그 부분을 해 보았습니다만, 필요한 대로 html을 렌더링하지 않고서는 어떻게 할 수 있을지 모르겠습니다.이것이 리액션의 실용적인 활용 사례라도 됩니까?React > = 16.2에서는 다음 버전 중 하나를 사용할 수 있습니다. render() { return false; } render() { return null; } render() { return [..

programing 2023.03.07

material-ui 1.0 목록에 링크를 추가하는 방법

material-ui 1.0 목록에 링크를 추가하는 방법 다음은 onClick 애니메이션을 방해합니다(ListItem이 빨간색으로 바뀝니다). ListItem 내부에 링크를 추가할 때 ListItem이 동작하는 경우에만 이행이 이루어집니다.텍스트가 클릭되고 있는데, 이것은 내가 원하는 것이 아니다.링크를 추가하는 올바른 방법은 무엇입니까?to use with "react-router-dom" import { Link } from "react-router-dom"; 이 예에서는 docs에 대해 설명합니다.이를 실현하기 위한 가장 쉬운 방법은 이 시스템을ListItem를 사용한 링크component소품: 그렇게 하면ListItem원하는 장소에 링크하는 앵커 태그가 되지만 시각적인 변화가 없도록 적절한 스타일..

programing 2023.03.07

Redux와 Redux-Toolkit 중 어느 쪽을 사용해야 합니까?

Redux와 Redux-Toolkit 중 어느 쪽을 사용해야 합니까? 닫았습니다. 이 질문은의견 기반의현재 답변을 받고 있지 않습니다. 이 질문을 개선하시겠습니까?이 게시물을 편집하여 사실과 인용문으로 답변할 수 있도록 질문을 업데이트하십시오. 1년 전에 문을 닫았어요 커뮤니티는 4개월 전에 이 질문을 재개할지 여부를 검토한 후 종료했습니다. 원래 종료 이유가 해결되지 않았습니다. 이 질문을 개선하다 저는 레독스를 처음 배웁니다.그럼 레독스 툴킷의 존재를 알겠군궁금한 건 어떤 걸 써야 할까요?Redux-toolkit이 Redux core를 대체할 수 있습니까?예전에는 레덕스가 좋았는데, 만약 한 번도 먹어본 적이 없다면 레덕스 툴킷을 사용하는 것을 강력히 추천합니다.Redex를 계속 사용했으면 하는 유일..

programing 2023.03.07

오류 'document'가 정의되지 않았습니다. eslint / React

오류 'document'가 정의되지 않았습니다. eslint / React Create-React-app을 사용하여 React 앱을 만들고 있습니다. ESLint 실행 시 다음 오류가 발생하였습니다. 8:3 error 'document' is not defined no-undef. 앱은 오류 없이 실행되지만 2개의 파일에서 ESLint 오류가 발생했습니다.이것들 중 하나를 보세요..jsx파일 및 ESLint 설정을 지정합니다. index.syslogx: import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './index.css'; ReactDOM.render( , document.getEle..

programing 2023.03.07

React의 'scryRenderedDOM 컴포넌트'는 어디에 있습니까?WithClass의 메서드 이름은 어디서 왔습니까?

React의 'scryRenderedDOM 컴포넌트'는 어디에 있습니까?WithClass의 메서드 이름은 어디서 왔습니까? 리액트 컴포넌트 테스트 작업 중 문서를 읽다가scryRenderedDOMComponentsWithClass이 컴포넌트는 발음할 수 없기 때문에 기능을 이해하는 데 어려움을 겪고 있습니다.그래서 이 컴포넌트가 하는 일의 정신적 모델에 맵을 명명하는 방법을 이해할 수 없습니다.(관련된 이름에는 다음과 같은 것이 다수 있습니다.)scryRenderedDOMComponentsWithTag.) 의 개요scry이 메서드 이름의 일부는 무엇을 의미합니까?무서워? 서둘러?이 이름은 어떤 개념을 설명하려고 하는 걸까요?단답 이 문맥에서 "Scry"는 "find all"을 의미합니다.에서 이 코멘트를..

programing 2023.03.02
반응형