«react-hooks» 태그된 질문

useEffect는 훅이 모든 변화 기능에 전달 실행할 반응한다. 원하는 속성이 변경 될 때만 호출되도록 최적화 할 수 있습니다. 초기화 함수를 componentDidMount호출하고 변경시 다시 호출하지 않으 려면 어떻게해야 합니까? 엔터티를로드하려고하지만로드 기능에 구성 요소의 데이터가 필요하지 않다고 가정 해 봅시다. useEffect후크를 사용하여 어떻게 만들 수 있습니까? class MyComponent extends React.PureComponent { componentDidMount() …

210 javascript  reactjs  react-hooks 

React 16.8.6 (이전 버전 16.8.3에서는 좋았 음)으로 가져 오기 요청에서 무한 루프를 방지하려고하면이 오류가 발생합니다. ./src/components/BusinessesList.js Line 51: React Hook useEffect has a missing dependency: 'fetchBusinesses'. Either include it or remove the dependency array react-hooks/exhaustive-deps 무한 루프를 멈추는 해결책을 찾지 못했습니다. 사용하지 않고 싶습니다 useReducer(). 가능한 해결책이 내가하는 일에 확신이없는 …

177 reactjs  eslint  create-react-app  react-hooks 

React의 공식 문서에서는 다음과 같이 언급합니다. React 클래스 라이프 사이클 메소드에 익숙하다면 useEffect Hook를 componentDidMount, componentDidUpdate 및 componentWillUnmount 결합으로 생각할 수 있습니다. 내 질문은-어떻게 우리는 어떻게 componentWillMount()lifecyle 방법을 후크에서 사용할 수 있습니까?

175 javascript  reactjs  jsx  react-hooks 

나는 후크를 배우려고 노력하고 있으며 그 useState방법으로 인해 혼란스러워했다. 배열의 형태로 초기 값을 상태에 할당하고 있습니다. 세트 방법에는 useState심지어 나를 위해 작동하지 않습니다 spread(...)나 without spread operator. 다른 PC에서 API를 작성하여 상태로 설정하려는 데이터를 호출하고 가져옵니다. 내 코드는 다음과 같습니다. import React, { useState, useEffect } from "react"; import ReactDOM …

168 javascript  reactjs  react-hooks 

rate, sendAmount 및 receiveAmount의 세 가지 입력이 있다고 가정합니다. 3 개의 입력을 useEffect diffing params에 넣었습니다. 규칙은 다음과 같습니다. sendAmount가 변경되면 계산 receiveAmount = sendAmount * rate receiveAmount가 변경되면 계산 sendAmount = receiveAmount / rate 속도를 변경 한 경우, 내가 계산할 receiveAmount = sendAmount * rate때 sendAmount > 0또는 내가 …

150 reactjs  react-hooks 

간단한 문제에 반응 후크를 사용하려고합니다. const [personState,setPersonState] = useState({ DefinedObject }); 다음과 같은 종속성이 있습니다. "dependencies": { "react": "^16.8.6", "react-dom": "^16.8.6", "react-scripts": "3.0.0" } 하지만 여전히 다음과 같은 오류가 발생합니다. ./src/App.js 7 행 : React Hook "useState"는 React 함수 구성 요소 또는 사용자 지정 React Hook 함수가 아닌 "app"함수에서 호출됩니다. …

149 reactjs  react-hooks 

저는 현재 React에서 후크 개념을 배우고 있으며 아래 예제를 이해하려고 노력하고 있습니다. import { useState } from 'react'; function Example() { // Declare a new state variable, which we'll call "count" const [count, setCount] = useState(0); return ( <div> <p>You clicked {count} times</p> <button onClick={() => setCount(count + 1)}> Click …

134 javascript  reactjs  react-native  react-hooks 

useState 배열 React 후크 내부에 요소를 푸시하는 방법은 무엇입니까? 반응 상태의 오래된 방법입니까? 아니면 새로운 것? 예 : setState 푸시 예 ?

127 javascript  reactjs  react-hooks 

다른 상태에 의존하는 상태가 있다고 가정 해 보겠습니다 (예 : A가 변경되면 B가 변경되기를 원합니다). A를 관찰하고 useEffect 후크 내부에 B를 설정하는 후크를 만드는 것이 적절합니까? 버튼을 클릭하면 첫 번째 효과가 발생하여 다음 렌더링 전에 b가 변경되어 두 번째 효과가 발생하도록 효과가 계단식으로 표시됩니까? 이와 같은 코드를 구조화하는 데 성능 …

124 javascript  reactjs  react-hooks 

처음으로 React hooks를 시도하고 있는데 데이터를 얻고 두 개의 다른 상태 변수 (데이터 및 로딩 플래그)를 업데이트 할 때 두 호출 모두에도 불구하고 내 구성 요소 (데이터 테이블)가 두 번 렌더링된다는 사실을 깨달을 때까지 모두 괜찮아 보였습니다. 상태 업데이트 프로그램에 동일한 기능이 발생합니다. 다음은 내 구성 요소에 두 변수를 모두 …

122 javascript  reactjs  react-hooks 

나는 우연히 발견했을 때 후크 문서를 살펴보고 있었다 useRef. 그들의 예를 보면… function TextInputWithFocusButton() { const inputEl = useRef(null); const onButtonClick = () => { // `current` points to the mounted text input element inputEl.current.focus(); }; return ( <> <input ref={inputEl} type="text" /> <button onClick={onButtonClick}>Focus the input</button> </> ); } …

120 javascript  reactjs  react-hooks 

적용 할 몇 가지 부작용이 있으며이를 구성하는 방법을 알고 싶습니다. 일회용으로 또는 여러 useEffects 성능과 아키텍처 측면에서 무엇이 더 낫습니까?

118 reactjs  react-hooks 

아래와 같은 useEffect 예제를 시도했습니다. useEffect(async () => { try { const response = await fetch(`https://www.reddit.com/r/${subreddit}.json`); const json = await response.json(); setPosts(json.data.children.map(it => it.data)); } catch (e) { console.error(e); } }, []); 코드 조각 실행결과 숨기기스 니펫 확장 내 콘솔에이 경고가 표시됩니다. 그러나 정리는 내가 생각하는 비동기 호출의 경우 선택 …

117 javascript  reactjs  react-hooks 

아래 후크 예제 고려 import { useState } from 'react'; function Example() { const [count, setCount] = useState(0); return ( <div> <p>You clicked {count} times</p> <button onClick={() => setCount(count + 1)}> Click me </button> </div> ); } 기본적으로 this.forceUpdate () 메서드를 사용하여 아래 예제와 같이 React 클래스 구성 요소에서 구성 …

116 javascript  reactjs  react-native  react-hooks 

React with Hooks에서 상태를 업데이트하는 올바른 방법은 무엇입니까? export Example = () => { const [exampleState, setExampleState] = useState( {masterField: { fieldOne: "a", fieldTwo: { fieldTwoOne: "b" fieldTwoTwo: "c" } } }) 한 사람이 어떻게 사용하는 것이 setExampleState업데이 트에 exampleState에 a(AN 필드를 추가)? const a = { masterField: { fieldOne: …

116 javascript  reactjs  react-hooks