cyworld

componentDidMount를 사용으로 변환하는 중효과 리액션 훅을 배우고 기존 코드베이스를 훅으로 전환하려고 하는데 헷갈린다.내부 상태를 설정하는 것이 정상인가?useEffect내가 그렇게 한다면 두려운 무한순환을 일으킬까? import React, { useState, useEffect } from 'react'; import App from 'next/app'; import Layout from './../components/Layout'; function MyApp({ Component, pageProps }) { const [ cart, setCart ] = useState([]); const addToCart = (product) => { setCart((prevCartState) => {..

이미 설정된 리액션 후크를 다른 값으로 설정하는 방법 리액션 후크를 처음 사용하는데 내가 해결할 수 없는 문제를 우연히 발견했어.나는 그것을 사용하고 있다.formAmount그것을 저장하기 위한 입력값을 얻기 위해 후크를 걸다.state.amount그렇게 되면, 그 금액은 사용자가 숫자를 넣을 때마다 합계를 숫자로 줄여야 한다.문제는 앞으로 새로운 배열을 만들 수 없다는 점이다.onChange왜냐하면 그것은 키의 모든 스트로크를 목록화해서 완전한 번호를 나에게 주지 않고 내가 그것을 직접 설정할 수 없기 때문이다.state.amount어떻게 하면 그 양을 구해서 배열로 보관할 수 있을까? 내 암호는 다음과 같다. const Transactions = () => { const [state, setState..

반응 후크가 환원제를 완전히 대체할 수 있는가? 나는 리액션 훅을 배우고 있는데, 지금까지 그것이 리액션 훅을 만드는 방법이라는 것을 보았다. 이 멋진 새로운 것이 생기기 전에는 없었던 리액션 훅이었다. 나는 또한 후크를 사용하여 다른 구성요소들 간에 상태를 공유하려고 노력했고, 구성요소가 상태 내부의 값을 변경하면 다른 구성요소가 업데이트를 받는다.그렇다면 Redex나 다른 국가 관리 솔루션이 리액션 후크로 완전히 대체될 수 있을까?장단점이 있는가? Redex 기반 앱을 후크로 마이그레이션하기 전에 고려해야 할 사항이 있으십니까?나는 큰 제3자 도서관을 좋아하지 않는다. 만약 내가 반응하는 도구로 같은 목표를 달성할 수 있다면, 왜 안 될까? Redex의 사용이 프로펠링을 피해야 하는 필요성에 기초하는..

반응 컨텍스트 및 후크 API의 효소 오류 내 작은 리액션 후크 앱의 인증을 처리하기 위해 이 루트 컨텍스트를 만들었다.효소세포를 이용해 이상한 실수를 하는 것 외에는 모든 것이 예상대로 작동한다.shallow그리고mount. 이렇게 시험해 보려고 한다. const wrapper = mount() 색인: import RootContext from './RootContext' function Root() { return ( ) } ReactDOM.render(, document.getElementById('root')); 루트 컨텍스트: import React, { useEffect, useState } from 'react' export const RootContext = React.createConte..

useEffect를 사용해야 하는 이유가 있는가? 따라서 종속성 어레이 없이 Effect를 사용하면 모든 렌더에서 이러한 현상이 발생한다. 하지만 코드를 컴포넌트에 직접 적기만 하면 그렇게 될 겁니다.그래서 그것을 사용할 이유가 있을까? 한 가지 생각할 수 있는 것은 청소기능으로 뭔가를 하는 것이지만, 유효한 사용사례를 생각해 낼 수는 없다. 하지만 코드를 컴포넌트에 직접 적기만 하면 그렇게 될 겁니다. 사실, 그것은 완전히 사실이 아니다. 예를 들어 useState를 동일한 값으로 업데이트하면 React는 함수 구성요소를 재평가하지만 효과를 트리거하지 않고 useEffect 밖의 코드를 실행하지만 내부 useEffect는 실행하지 않는다. 공식 문서에는 주정부 업데이트에서 벗어나라는 내용이 적혀 있다...

클래스 기반 접근방식과 비교하여 Hooks로 상태를 설정한 후 재렌더링할 때 어떤 차이가 있는가? 클래스 구성 요소 React class 구성 요소에서는setState 상태가 실제로 새로운 값으로 변경되었는지 여부에 관계없이 항상 재조정을 유발한다.실제로 구성요소는 상태가 이전과 동일한 값으로 업데이트될 때 다시 렌더링된다. 문서(setState API Reference 설정): setState()는 componentUpdate()가 false를 반환하지 않는 한 항상 rerender로 이어진다. 후크(기능 구성 요소) 그러나 후크를 사용하여 문서에서는 이전 상태와 동일한 값으로 상태를 업데이트하면 (하위 구성 요소의) 리렌더가 발생하지 않는다고 명시한다. 문서(상태 API 참조 사용): 상태 업데이트에..

기능이 소품으로 전달될 때 Array.map의 반응 기능 구성 요소가 항상 리렌더링됨 모든 자식 상태를 중앙에서 관리하는 부모 구성요소에 여러 개의 버튼을 렌더링하려고 한다.이것은 부모가 클릭 상태, 즉 자신의 상태에 있는 각 버튼에 대해 사용 불가능한 상태를 저장한다는 것을 의미한다.useState아이들에게 소품으로 물려주는 거야또한,onClick함수는 또한 부모 구성요소의 내부에서 정의되며 각 자식에게 전달된다.지금 나는 다음과 같이 하고 있다. const [isSelected, setIsSelected] = useState(Array(49).fill(false)); ... const onClick = useCallback((index) => { const newIsSelected = [...prev..

Resact useState()를 통해 양식 데이터를 처리하는 더 나은 방법? 내 코드의 반복을 멈추게 할 더 좋은 해결책이 있는지 궁금해서?나는 현재 사용하고 있다.useState()사용자 데이터를 처리하고 여러 분야의 부하가 있기 때문에 반복적이다.아래 내 코드는 다음과 같다. const [lname, setLast] = useState(""); const [country, setCountry] = useState(""); const [phone, setPhone] = useState(""); const [email, setUsername] = useState(""); const [username, setEmail] = useState(""); const [password, setPassword] =..

useEffect를 사용하여 반응 구성 요소의 메모리 누수 나는 "뉴스"를 열면 모달로 된 설명을 볼 수 있고, 완벽히 작동하지만, 제안을 클릭하면 해당 제품에 대한 정보가 있는 다른 페이지로 리디렉션되는 Carrouzel을 하고 있다. 작동하지만 실행하면 콘솔에 메모리 누수 오류 "react-dom.development.js:67 경고: 마운트 해제된 구성 요소에 대해 반응 상태 업데이트를 수행할 수 없음 이것은 작동 불가지만, 당신의 어플리케이션에 메모리 누수가 있다는 것을 나타낸다. 수정하려면 useEffect cleaning 함수의 모든 구독 및 비동기 작업을 취소하십시오. 나는 useEffect를 사용하는 것을 알고 있고 이것을 피하는 방법을 모른다. 시간 내줘서 고마워 "AxiosCollect..

반응 - useState의 setter 기능을 변경할 수 있는가? useState의 세터는 구성 요소 수명 동안 변경할 수 있는가? 예를 들어, 우리가 한 가지 문제를 가지고 있다고 가정해 봅시다.useCallback상태를 갱신할 수 있을 겁니다세터가 변경할 수 있는 경우 콜백은 콜백을 사용하기 때문에 콜백의 종속성으로 설정되어야 한다. const [state, setState] = useState(false); const callback = useCallback( () => setState(true), [setState] // { // Always new instance const dispatch = useDispatch(); // Should be in a callback const increment..