구성 요소의 구독에 의해 선택되지 않은 상태 변경

Brandon

Angular2 앱에서 상태 관리를 제공하기 위해 ngrx를 사용하고 있습니다. 나는 두 가지 구성 요소를 가지고 MenuComponentResultsPanelComponent그 국가의 동일한 슬라이스에 의해 제공되는 다른 값에 가입.

내가보고있는 문제는 "메뉴"구성 요소가 상태 변경에 응답하지만 상태 값을 기록 할 때 "결과"구성 요소가 응답하지 않는다는 것입니다.

상위 구성 요소에 상태를 채우는 작업을 발송하고 있습니다.

menu.component.ts

export class MenuComponent implements OnInit, OnDestroy {
  private sub: Subscription;
  newReportHeaderCount: number;

  constructor(private store: Store<AppState>) {}

  ngOnInit(): void {
    this.sub = this.store.select('results').subscribe((state) => {
      console.log('MenuComponent state: ', state);
      this.newReportHeaderCount = state['newReportHeaderCount'];
    });
  }

  ngOnDestroy(): void {
    this.sub.unsubscribe();
  }
}

results.component.ts

export class ResultsPanelComponent implements OnInit, OnDestroy {
  private sub: Subscription;
  reportHeaderSummary: ReportHeaderSummary[] = [];

  constructor(private store: Store<AppState>) {}

  ngOnInit(): void {
    this.sub = this.store.select('results').subscribe((state) => {
      console.log('ResultsPanelComponent state: ', state);
      this.reportHeaderSummary = state['reportHeaderSummary'];
    });
  }

  ngOnDestroy(): void {
    this.sub.unsubscribe();
  }
}

내 앱을 실행하면 다음이 표시됩니다.

MenuComponent state:  Object {reportHeaderSummary: Array[0], reportHeaders: Array[0], newReportHeaderCount: 0, loading: false}
ResultsPanelComponent state:  Object {reportHeaderSummary: Array[0], reportHeaders: Array[0], newReportHeaderCount: 0, loading: false}
MenuComponent state:  Object {reportHeaderSummary: Array[4], reportHeaders: Array[0], newReportHeaderCount: 3, loading: false}

콘솔에 기록되었습니다. ResultsPanelComponent state상태가 변경되었을 때에 대한 로그 문이 하나 더 표시 될 것으로 예상합니다 .

ResultsPanelComponent상이한 모듈로되어 MenuComponent있지만, 모두가 데이터를로드 할 작업을 전달 동일한 상위 모듈에 포함된다.

[최신 정보]

newReportHeaderCount을 증가시키기 위해 추가 작업을 수행했으며 MenuComponent또는 에서 디스패치 ResultsPanelComponent되면 상태가 정확하지만 새 값이 results상태 슬라이스 를 구독하는 모든 구성 요소에 푸시되지는 않습니다 .

액션을 전달한 구성 요소의 새 상태 값만 볼 수 있습니다.

액션 디스패치를 ​​상위 구성 요소로 이동하면 상태 변경 만 볼 수 있습니다. MenuComponent

내가 뭘 잘못하고 있는지에 대한 아이디어가 있습니까?

Brandon

다른 여러 모듈에서 공유되는 모듈에서 EffectListener 및 provideStore를로드했습니다.

나는 그것들을 내 뿌리로 옮겼고 AppModule모든 것이 예상대로 작동합니다.

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

구성 요소의 상태를 변경하지 않고 구성 요소의 상태 복사본을 변경하는 방법은 무엇입니까?

분류에서Dev

iOS 9.2 UIDatePicker 구성 요소 현재 선택된 구성 요소 행의 텍스트 색상이 변경되지 않았습니다.

분류에서Dev

React 구성 요소의 상태 변경 후 예기치 않은 동작

분류에서Dev

부모의 상태 변경 후 자식 구성 요소 소품이 업데이트되지 않음

분류에서Dev

새 상태가 React / Redux의 콘솔에 표시되지만 Props 변경 사항은 구성 요소 UI에 반영되지 않습니다.

분류에서Dev

부모의 상태가 변경된 후 ReactJS 자식 구성 요소가 업데이트되지 않음

분류에서Dev

ReactJs에서 이벤트를 직접 처리하지 않는 구성 요소의 상태 변경

분류에서Dev

Reactjs 상태 변경은 동적으로 생성 된 하위 구성 요소에 전파되지 않습니다.

분류에서Dev

상태 변경시 Angular 구성 요소 스크립트의 지연로드

분류에서Dev

상태 변경 후 다시 렌더링되지 않는 반응, 자식 구성 요소의 상태를 어떻게 설정합니까?

분류에서Dev

setState ()를 사용해도 상태 변경 후 React 구성 요소가 다시 렌더링되지 않습니다.

분류에서Dev

Nuxt Vuex 상태 메뉴 목록 : 구성 요소에 정의되지 않음

분류에서Dev

상태가 변경 될 때 반응 구성 요소의 입력 요소 값이 다시 렌더링되지 않습니다.

분류에서Dev

정의되지 않은 구성 요소에서 상태를 소품으로 전달하는 감속기

분류에서Dev

VUE 구성 요소의 정의되지 않은 변수

분류에서Dev

ReactJS : 하위 구성 요소의 상태 변경

분류에서Dev

'삼촌'구성 요소의 상태 변경?

분류에서Dev

(SCSS) 후속 요소의 상태에 따라 선행 요소의 속성 변경

분류에서Dev

상태 변경시 React JS 구성 요소가 업데이트되지 않음

분류에서Dev

redux 상태 변경시 구성 요소가 업데이트되지 않음

분류에서Dev

기본 구성 요소 클래스에서 상태를 사용할 때 반응에서 정의되지 않은

분류에서Dev

효소 : 상태 비 저장 기능 구성 요소가 정의되지 않은 소품을 반환합니다.

분류에서Dev

다른 파일의 다른 구성 요소에서 한 구성 요소의 상태 변경

분류에서Dev

다른 구성 요소의 상태에 따라 React 구성 요소 가시성 변경

분류에서Dev

React Native에서 한 함수 구성 요소의 상태를 다른 함수 구성 요소에서 변경하는 방법은 무엇입니까?

분류에서Dev

반응에서 다른 구성 요소의 자식 상태가 변경되면 이벤트 트리거

분류에서Dev

React Native에서 상태 변경 후에도 구성 요소의 오버레이가 사라지지 않습니다.

분류에서Dev

다른 구성 요소에서 반응 구성 요소의 상태를 어떻게 변경합니까?

분류에서Dev

기능 구성 요소의 부모에서 자식 상태 구성 요소를 변경하는 방법

Related 관련 기사

  1. 1

    구성 요소의 상태를 변경하지 않고 구성 요소의 상태 복사본을 변경하는 방법은 무엇입니까?

  2. 2

    iOS 9.2 UIDatePicker 구성 요소 현재 선택된 구성 요소 행의 텍스트 색상이 변경되지 않았습니다.

  3. 3

    React 구성 요소의 상태 변경 후 예기치 않은 동작

  4. 4

    부모의 상태 변경 후 자식 구성 요소 소품이 업데이트되지 않음

  5. 5

    새 상태가 React / Redux의 콘솔에 표시되지만 Props 변경 사항은 구성 요소 UI에 반영되지 않습니다.

  6. 6

    부모의 상태가 변경된 후 ReactJS 자식 구성 요소가 업데이트되지 않음

  7. 7

    ReactJs에서 이벤트를 직접 처리하지 않는 구성 요소의 상태 변경

  8. 8

    Reactjs 상태 변경은 동적으로 생성 된 하위 구성 요소에 전파되지 않습니다.

  9. 9

    상태 변경시 Angular 구성 요소 스크립트의 지연로드

  10. 10

    상태 변경 후 다시 렌더링되지 않는 반응, 자식 구성 요소의 상태를 어떻게 설정합니까?

  11. 11

    setState ()를 사용해도 상태 변경 후 React 구성 요소가 다시 렌더링되지 않습니다.

  12. 12

    Nuxt Vuex 상태 메뉴 목록 : 구성 요소에 정의되지 않음

  13. 13

    상태가 변경 될 때 반응 구성 요소의 입력 요소 값이 다시 렌더링되지 않습니다.

  14. 14

    정의되지 않은 구성 요소에서 상태를 소품으로 전달하는 감속기

  15. 15

    VUE 구성 요소의 정의되지 않은 변수

  16. 16

    ReactJS : 하위 구성 요소의 상태 변경

  17. 17

    '삼촌'구성 요소의 상태 변경?

  18. 18

    (SCSS) 후속 요소의 상태에 따라 선행 요소의 속성 변경

  19. 19

    상태 변경시 React JS 구성 요소가 업데이트되지 않음

  20. 20

    redux 상태 변경시 구성 요소가 업데이트되지 않음

  21. 21

    기본 구성 요소 클래스에서 상태를 사용할 때 반응에서 정의되지 않은

  22. 22

    효소 : 상태 비 저장 기능 구성 요소가 정의되지 않은 소품을 반환합니다.

  23. 23

    다른 파일의 다른 구성 요소에서 한 구성 요소의 상태 변경

  24. 24

    다른 구성 요소의 상태에 따라 React 구성 요소 가시성 변경

  25. 25

    React Native에서 한 함수 구성 요소의 상태를 다른 함수 구성 요소에서 변경하는 방법은 무엇입니까?

  26. 26

    반응에서 다른 구성 요소의 자식 상태가 변경되면 이벤트 트리거

  27. 27

    React Native에서 상태 변경 후에도 구성 요소의 오버레이가 사라지지 않습니다.

  28. 28

    다른 구성 요소에서 반응 구성 요소의 상태를 어떻게 변경합니까?

  29. 29

    기능 구성 요소의 부모에서 자식 상태 구성 요소를 변경하는 방법

뜨겁다태그

보관