반응형

reactjs 22

React Native: 요소의 위치 가져오기

React Native: 요소의 위치 가져오기 스타일링하고 있어요Image플렉스 박스가 있는 컴포넌트는 화면 중앙에 배치되어 매우 잘 작동합니다.이제 좀 기다려줘Image첫 번째 컴포넌트 상단에 직접 표시됩니다.두 번째 이미지는 절대 위치를 사용하고 있습니다.현시점에서는 픽셀이 맞도록 추측하고 있습니다만, 물론 정확하지 않고 유지보수에 너무 많은 노력을 기울이고 있습니다. jQuery의 리액트 네이티브와 동등한 제품을 찾고 있습니다..offset()그런 게 있나요? 만약 없다면 어떻게 하는 게 최선일까요?React Native는 콜백을 받아 컴포넌트의 오프셋과 너비/높이로 호출하는 메서드를 제공합니다. myComponent.measure( (fx, fy, width, height, px, py) => {..

programing 2023.03.17

Jest 테스트 실행 시 'regeneratorRuntime'이 정의되지 않음

Jest 테스트 실행 시 'regeneratorRuntime'이 정의되지 않음 제목이 내가 직면한 상황을 거의 설명해준다.테스트하려고 합니다.React컴포넌트가 필요한 것을 얻기 위해 컴포넌트에 스토어를 제공하려고 합니다.Jest를 사용하여 컴포넌트 테스트를 실행하면 다음 오류가 나타납니다. ReferenceError: regeneratorRuntime is not defined 어떤 독서를 통해 이 원인이babel-polyfill또는regenerator-runtimeJest에 올바르게 적용되지 않습니다.그러나 저는 두 패키지를 모두 설치해서 다시 실행해 보았습니다만, 결과는 변하지 않았습니다.Jest Github issues 페이지(Babel-polyfill #2755의 자동 포함 제거)를 읽은 후 다..

programing 2023.03.17

Jest를 사용하여 소품으로 React 구성 요소 시뮬레이션

Jest를 사용하여 소품으로 React 구성 요소 시뮬레이션 React 컴포넌트에는 완전한 효소 마운트를 실행할 때 문제를 일으키는 Redux 스토어 등에 대한 접근에 의존하는 다른 컴포넌트가 포함되어 있습니다.예를 들어 다음과 같은 구조입니다. import ComponentToMock from './ComponentToMock'; ...some stuff 의 Jeste를 ..mock()테스트의 문제가 되지 않도록 하위 구성요소를 시뮬레이션하는 방법. 다음과 같은 방법으로 스트레이트 컴포넌트를 시뮬레이션할 수 있습니다. jest.mock('./ComponentToMock', () => 'ComponentToMock'); 이 소품을 소품에 대해 경우 React는 Resact를 합니다).testProp에 됩..

programing 2023.03.17

React.컴포넌트 대 리액트순수 컴포넌트

React.컴포넌트 대 리액트순수 컴포넌트 닫혔어. 이 질문은 좀 더 자세히 설명해야 합니다.초점을 맞춥니다.현재 답변을 받고 있지 않습니다. 이 질문을 개선하시겠습니까?이 게시물을 편집하여 하나의 문제에 초점을 맞추도록 질문을 업데이트하십시오. 12개월 전에 닫았어요 커뮤니티는 12개월 전에 이 질문을 재개할지 여부를 검토한 후 종료했습니다. 원래 종료 이유가 해결되지 않았습니다. 이 질문을 개선하다 React 공식 문서에는 다음과 같이 기술되어 있습니다.React.PureComponent의 »shouldComponentUpdate()얄팍하게 오브젝트만 비교하고 상태가 "깊이"인 경우에는 이를 피하도록 조언합니다. 에, 「 」 「 」 「 」 「 」 「 」를 가 있는 이유는 입니까?React.PureCo..

programing 2023.03.12

ReactJs가 Uncaught TypeError: 오류를 발생시킵니다.슈퍼 표현식은 정의되지 않은 null 또는 함수여야 합니다.

ReactJs가 Uncaught TypeError: 오류를 발생시킵니다.슈퍼 표현식은 정의되지 않은 null 또는 함수여야 합니다. React JS를 사용하고 있습니다. 아래 코드를 실행하면 브라우저에 다음과 같이 표시됩니다. 수집되지 않은 유형 오류:슈퍼 표현식은 정의되지 않은 null 또는 함수여야 합니다. 무엇이 잘못되었는지에 대한 어떤 힌트라도 주시면 감사하겠습니다. 먼저 코드 컴파일에 사용되는 행: browserify -t reactify -t babelify examples/temp.jsx -o examples/public/app.js 그리고 코드: var React = require('react'); class HelloMessage extends React.Component { render..

programing 2023.03.07

Typescript와 함께 스타일링된 컴포넌트를 사용하면 프로펠러가 존재하지 않습니까?

Typescript와 함께 스타일링된 컴포넌트를 사용하면 프로펠러가 존재하지 않습니까? 여기 제 스타일링 컴포넌트입니다. import * as React from 'react'; import styled from 'styled-components'; import { ComponentChildren } from 'app-types'; interface Props { children: ComponentChildren; emphasized: boolean; } const HeadingStyled = styled.h2` ${props => props.emphasized && css` display: inline; padding-top: 10px; padding-right: 30px; `} `; const Hea..

programing 2023.03.07

useEffect hook을 조기 종료하는 방법

useEffect hook을 조기 종료하는 방법 문서에는 컴포넌트의 최상위 레벨에만 후크를 호출해야 한다고 나와 있습니다.useEffect의 API로 인해return는 이미 청소용으로 예약되어 있기 때문에 어떻게 하면 if 스테이트먼트를 완전히 네스트하지 않도록 useEffect 훅을 조기에 종료할 수 있는지 궁금했습니다. // instead of React.useEffect(() => { if (foo){ // do something } }) // I would rather write something like React.useEffect(() => { if (!foo){ // exit early and stop executing the rest of the useEffect hook } // do s..

programing 2023.03.02

대응: useEffect vs useMemo vs useState

대응: useEffect vs useMemo vs useState 나는 웹에서 이것에 대한 간결한 답을 찾으려고 노력했지만 운이 없었다. 문항은 다 다르다, 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 다르고 요?useEffect,useMemo ★★★★★★★★★★★★★★★★★」useState 다. useState ★★★★★★★★★★★★★★★★★」useMemo는 렌더링 전체에서 값을 기억합니다.츠키다 useMemo만, 「재연결이 없다」라고 하는 것은,useState useMemo 경우setSomeState된 두 번째 )useState 어레이를 있지 않습니다.이치노 다. useMemo ★★★★★★★★★★★★★★★★★」useEffect는 의존관계가..

programing 2023.03.02

반응: 기능 컴포넌트에 소품 전달

반응: 기능 컴포넌트에 소품 전달 소품이나 기능 컴포넌트에 대해 사소한 질문이 있습니다.기본적으로 사용자의 버튼 클릭에 의해 트리거되는 상태 변경 시 Modal 컴포넌트를 렌더링하는 컨테이너 컴포넌트가 있습니다.모달은 컨테이너 컴포넌트 내부에 존재하는 함수에 연결해야 하는 일부 입력 필드를 저장하는 스테이트리스 함수 컴포넌트입니다. 질문입니다.사용자가 상태 비저장 Modal 구성 요소 내의 양식 필드와 상호 작용하는 동안 상위 구성 요소 내부에 있는 함수를 사용하여 상태를 변경하려면 어떻게 해야 합니까?제가 소품을 잘못 전달한 건가요? 컨테이너. export default class LookupForm extends Component { constructor(props) { super(props); th..

programing 2023.02.25
반응형