반응형

reactjs 23

클래스 컴포넌트에서 react-redux useSelector를 사용하려면 어떻게 해야 합니까?

클래스 컴포넌트에서 react-redux useSelector를 사용하려면 어떻게 해야 합니까? 나는 리액션에서 처음이고 레덕스를 배우려고 한다.클래스 내의 스토어에 액세스 하고 싶은데, 수업중에 후크를 사용할 수 없다는 에러가 표시됩니다. 이 코드를 기능적으로 사용하면(YouTube 튜토리얼에서 본 것처럼) 문제없이 동작합니다.여기 가게 카운터가 있어요. function App() { const counter = useSelector(state => state.counter); return {counter}; } 하지만 수업 중에 이걸 하고 싶을 때 수업 중에 훅을 사용할 수 없다는 오류가 발생합니다. 그러면 클래스 컴포넌트에서 useSelector 또는 useDispatch 중 하나를 사용하여 스토어..

prosource 2023.03.09

Redux 연결 컴포넌트는 재렌더 타이밍을 어떻게 알 수 있습니까?

Redux 연결 컴포넌트는 재렌더 타이밍을 어떻게 알 수 있습니까? 제가 뭔가 명백한 것을 놓치고 있는 것 같아서 마음을 정리하고 싶습니다. 을 사용하다 에는 '성분.states&props 중.statesetState전체 컴포넌트를 다시 장착합니다. props대부분 읽기 전용이며 업데이트는 의미가 없습니다. 스토어에 에서는 리덕스 스토어에 .store.subscribe(render)스토어가 갱신될 때마다 다시 표시됩니다. react-suplex에는 도우미가 있다.connect()트리의 이 있음)와를 actionCreators로 삽입합니다.props via트음 음음음음음음 같은 것을 합니다. const TodoListComponent = connect( mapStateToProps, mapDispatchT..

prosource 2023.03.09

Material-UI에서 TextField의 밑줄을 삭제하려면 어떻게 해야 합니까?

Material-UI에서 TextField의 밑줄을 삭제하려면 어떻게 해야 합니까? 이 질문에는 이미 답변이 있습니다. MUI TextField 구성 요소의 스타일을 MUI 제공자를 사용하지 않고 재정의하려면 어떻게 해야 합니까? (4개의 답변) 닫힘2년 전에요. material-ui TextField를 사용할 때 TextField를 naked(밑줄 없음)로 하고 싶습니다.material-ui의 InputBase를 사용하면 가능하지만, 그러기 위해서는 TextField API를 사용해야 하는데 API 가이드에서는 방법을 찾을 수 없었습니다.를 사용할 수도 있습니다.InputPropsTextField 컴포넌트의 프로포트를 사용하여 이 작업을 수행합니다.disableUnderline의 재산.true. 이 답..

prosource 2023.03.09

styled-components - html 또는 본문 태그에 스타일을 설정하는 방법

styled-components - html 또는 본문 태그에 스타일을 설정하는 방법 보통 순수 CSS를 사용할 때 다음을 포함하는 스타일시트가 있습니다. html { height: 100%; } body { font-size: 14px; } 사용시styled-components리액트 프로젝트에서는, 어떻게 하면,html또는body태그? 이 목적으로만 별도의 CSS 파일을 유지해야 합니까?물론 HTML에 포함된 개별 CSS 파일을 관리할 수 있습니다.태그를 붙입니다. 위해서v4: 스타일드 컴포넌트에서 createGlobalStyle을 사용합니다. import { createGlobalStyle } from 'styled-components' const GlobalStyle = createGlobalSty..

prosource 2023.03.04

패키지 서명이 이전에 설치된 버전과 일치하지 않습니다.

패키지 서명이 이전에 설치된 버전과 일치하지 않습니다. 이것은 제 프로젝트입니다.https://github.com/kenpeter/my_hak_news,은 https://github.com/grigio/HAgnostic-News의 다이렉트 카피입니다. Git clone https://github.com/kenpeter/my_hak_news, 를 실행합니다.react-native run-android 다음 오류가 발생하였습니다. * What went wrong: Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: Fai..

prosource 2023.03.04

React 16.2에서 예기치 않은 토큰 오류를 나타내는 fragment

React 16.2에서 예기치 않은 토큰 오류를 나타내는 fragment 저는 일련의 컴포넌트를 렌더링하는 다음 컴포넌트를 가지고 있습니다.그러나 React 16.2를 다운로드하여 div 대신 fragment를 사용하려고 하면 다음과 같은 오류가 나타납니다. Error in ./src/containers/answers.js Syntax error: Unexpected token (24:5) 22 | 23 | return ( > 24 | | ^ 25 | {AnswersCard} 26 | 27 | ) 리액트 16.2의 div를 fragment로 대체할 수 있을 텐데 왜 이 에러가 발생하는 거죠? question ? AnswersCard = ( question.answers.sort(function(a,b) ..

prosource 2023.02.27

React의 .js, .tsx 및 .jsx의 차이점은 무엇입니까?

React의 .js, .tsx 및 .jsx의 차이점은 무엇입니까? 다음과 같은 3가지 주요 파일 유형이 있습니다. .js .tsx .jsx 3개의 차이점은 무엇입니까?어떤 것을 사용해야 할까요?어떤 것이 더 많이 사용됩니까? .jsJavaScript, 평소와 심플함 const Foo = () => { return React.createElement("div", null, "Hello World!"); }; .tsTypeScript는 Microsoft가 JavaScript에 "구체적인" 유형을 추가하는 방법입니다. const Foo: FunctionalComponent = () => { return React.createElement("div", null, "Hello World!"); }; .jsxJav..

prosource 2023.02.22

Create React App에서 이젝트는 어떤 역할을 합니까?

Create React App에서 이젝트는 어떤 역할을 합니까? 웹 팩을 직접 사용하는 것과 관련이 있기 때문에 유연성이 높다고 생각합니다.하지만 누군가가 "퇴출"이 무엇을 의미하는지 설명할 수 있을지 완전히 확신할 수 없다.또한 Create react 앱을 꺼낼 경우 어떤 영향이 있습니까?이렇게 하는 게 나쁜 건가요, 아니면?부트스트랩 하려면react프로젝트에서는 웹팩이나 바벨과 같은 것에 대해 알아야 합니다.이것들은 배우고 싶지 않은 사람들에게 걸림돌이 될 수 있습니다. create-react-app는 합리적인 디폴트(및 확장 가능)로 완전히 구성된 환경을 제공합니다.인프라스트럭처 관련 작업은 대부분 숨겨져 있습니다.의존 패키지 중 하나에 변경이 있을 경우 언제든지 이 작업이 처리됩니다.갱신만 하면 ..

prosource 2023.02.16

대응: 부모 컴포넌트는 상태 변화에 따라 변경되지 않은 아이도 모두 재생성

대응: 부모 컴포넌트는 상태 변화에 따라 변경되지 않은 아이도 모두 재생성 아직 명확한 답을 찾지 못했습니다. 반복이 아니길 바랍니다. 간단한 채팅 앱으로 리액트+리덕스를 사용하고 있습니다.앱은 InputBar, MessageList 및 Container 구성 요소로 구성됩니다.컨테이너(상상할 수 있는 대로)는 다른 두 개의 구성요소를 랩하고 저장소에 연결됩니다.메시지 상태 및 현재 메시지(사용자가 현재 입력 중인 메시지)는 Redux 저장소에 저장됩니다.간단한 구조: class ContainerComponent extends Component { ... render() { return ( ); } } 현재 메시지를 업데이트할 때 문제가 발생합니다.현재 메시지를 업데이트하면 저장소를 업데이트하는 작업이 ..

prosource 2023.02.16
반응형