programing

Redux로 대응하시겠습니까?'문맥' 문제는 어떻습니까?

css3 2023. 3. 11. 09:20

Redux로 대응하시겠습니까?'문맥' 문제는 어떻습니까?

저는 보통 Stack에 코드 관련 글을 올립니다만, 이것은 커뮤니티의 일반적인 생각이 무엇인지에 대한 질문입니다.

데이터/상태를 관리하기 위해 Redx with React를 사용하는 것을 옹호하는 사람들이 많은 것 같습니다만, 읽고 배우다 보면 뭔가 이상합니다.

리덕스

이 페이지 하단의 http://redux.js.org/docs/basics/UsageWithReact.html(Passing the Store)에서는 React 'Context'의 'Magic' 사용을 권장합니다.

한 가지 방법은 모든 컨테이너 구성요소에 소품으로 전달하는 것입니다.그러나 컴포넌트 트리의 깊은 곳에 컨테이너가 렌더링된다는 이유만으로 프레젠테이션 컴포넌트를 통해서도 와이어 스토어가 필요하기 때문에 번거롭습니다.

권장되는 옵션은 모든 컨테이너 구성요소에서 저장소를 마법처럼 사용할 수 있도록 하기 위해 특수 React Redux 구성 요소를 사용하는 것입니다.

반응

[ React Context ]페이지(https://facebook.github.io/react/docs/context.html))의 상단에 경고가 표시됩니다.

콘텍스트는 고도의 실험 기능입니다.API는 향후 릴리즈에서 변경될 가능성이 있습니다.

그 다음 맨 아래:

명확한 코드를 작성할 때 글로벌 변수를 피하는 것이 가장 좋듯이 대부분의 경우 컨텍스트 사용을 피해야 합니다.

콘텍스트를 사용하여 모형 데이터를 성분을 통과시키지 마십시오.데이터를 명시적으로 트리에 스레드화하는 것이 훨씬 이해하기 쉽습니다.

그래서...

는 Redux를 React 할 것을 합니다.store각 구성 요소까지 '접속'을 통해 이동합니다.반응하다.

또, Dan Abramov(Redux의 작성자)가 Facebook(React의 작성자)에서 일하고 있는 것 같습니다.

  • 이거 다 제대로 읽고 있는 거야?
  • 이 문제에 대한 현재의 일반적인 합의는 무엇입니까?

컨텍스트는 고급 기능으로 변경될 수 있습니다.경우에 따라서는 편리성이 단점보다 뛰어나기 때문에 리액트 리덕스나 리액트 라우터와 같은 라이브러리는 실험적인 성질에도 불구하고 리액트 리덕트에 의존하는 것을 선택합니다.

여기서 중요한 부분은 단어 라이브러리입니다.문맥이 그 동작을 바꾸면 라이브러리 작성자로서 우리는 조정이 필요합니다.그러나 라이브러리가 직접 컨텍스트 API를 사용하도록 요구하지 않는 한, 사용자는 API의 변경에 대해 걱정할 필요가 없습니다.

React Redux는 내부적으로 콘텍스트를 사용하지만 공개 API에서는 이 사실을 공개하지 않습니다.따라서 콘텍스트를 직접 사용하는 것보다 React Redux를 통해 콘텍스트를 사용하는 것이 훨씬 안전하다고 느낄 수 있습니다. 콘텍스트가 변경될 경우 코드를 업데이트해야 하는 부담은 사용자가 아니라 React Redux에 있습니다.

궁극적으로 React Redux는 항상 점포를 소품으로 사용할 수 있도록 지원하므로 컨텍스트를 완전히 피하고 싶다면 이러한 옵션을 선택할 수 있습니다.그러나 나는 이것이 비현실적이라고 말하고 싶다.

TLDR: 실제로 무엇을 하고 있는지 모르는 한 콘텍스트를 직접 사용하지 마십시오.내부적으로 컨텍스트에 의존하는 라이브러리를 사용하는 것은 비교적 안전합니다.

다른 사람은 몰라도 리액트 리덕스의 커넥트 데코레이터를 사용하여 컴포넌트를 감싸서 필요한 스토어의 소품만 컴포넌트에 넣을 수 있도록 하는 것을 선호합니다.콘텍스트를 사용하지 않기 때문에 콘텍스트를 사용하는 것은 정당화됩니다(또한 일반적으로 내가 담당하고 있는 코드는 콘텍스트를 사용하지 않습니다).

컴포넌트를 테스트할 때는 포장되지 않은 컴포넌트를 테스트합니다.react-redux는 그 컴포넌트에 필요한 소품만 통과했기 때문에 이제 테스트를 작성할 때 필요한 소품이 무엇인지 정확히 알 수 있습니다.

요점은 코드에서 문맥이라는 단어를 본 적이 없고, 소비하지도 않기 때문에 어느 정도는 영향을 받지 않는다는 것입니다!이것은 페이스북의 "실험적" 경고에 대해 아무 말도 하지 않는다.만약 콘텍스트가 사라진다면, 레독스가 업데이트 될 때까지 나도 다른 사람들처럼 망했을 거야.

리액션 컨텍스트에 리덕스를 쉽게 추가할 수 있는 npm 모듈이 있습니다.

https://github.com/jamrizzi/redux-context-provider

https://www.npmjs.com/package/redux-context-provider

import React, { Component } from 'react';
import ReduxContextProvider from 'redux-context-provider';
import createStore from './createStore';
import actions from './actions';
import Routes from './routes';

export default class App extends Component {
  render() {
    return (
      <ReduxContextProvider store={store} actions={actions}>
        <Routes />
      </ReduxContextProvider>
    );
  }
}

React에는 라이브러리 추가 없이 상태를 처리하는 데 필요한 모든 기능이 포함되어 있습니다.어플리케이션의 대부분의 상태는 글로벌하지 않아야 합니다.이는 어플리케이션의 상태가 정상적으로 유지되기 때문입니다.useState또는useReducer또는 컴포넌트 옆에 있는 커스텀 훅을 선택합니다.

따라서 고급 상태 관리(예: Redx)를 시작하기 전에 React가 즉시 사용할 수 있는 툴을 사용해 보십시오.

이것에 대해 조금 더 알고 싶다면, Andy Fernandez의 이 기사를 추천하고 싶다.Redex: Context API vs Redex에 대한 자세한 내용은 다음과 같다.

언급URL : https://stackoverflow.com/questions/36428355/react-with-redux-what-about-the-context-issue