공부/TIL

[TIL] (오류) vue store의 action에서 data list를 새로 받아올 때 특정 값을 가진 data만 들어옴

2022. 5. 18. 16:58
문제의 발단

기존의 데이터 list를 보여주는 multiselect가 존재하는 페이지가 있다.

데이터를 신규 등록하는 버튼을 만들고, 신규 등록 중인 상태를 취소하는 버튼을 만들었다.

신규 등록을 취소하면 store에서 api 호출로 데이터를 새로 받아오도록 하고 싶었다.

그래서 아래처럼 적었다.

    onCancelClick () { // 취소 버튼 클릭 시
      this.actList({ params: this.params, menuAuth: this.checkMenuAuth('authList') })
    } // actList라는 action 실행

그리고...

가져오는 데이터(객체)에는 active: true 인 항목이 있었다.(활성화 여부)

화면에는 active 값을 변경시켜주는 radio가 존재하고(true / false)

결과적으로 활성화에 체크하면 multiselect의 v-model에 active가 true인 데이터만 들어오고,

비활성화에 체크하면 active가 false인 데이터만 들어왔다.

 

활성화 여부와 상관 없이 둘다 가져와야 했는데 말이다...

 

선임분께 여쭤보니 저 params의 this.params가 문제라고 하셨다.

actList가 동작할 때 this.params에 active 값이 담기기 때문에, active 값에 따라서 들어오는 params가 달라진 것이었다.

 

action을 이렇게 쓰는 게 처음이긴 하지만(dispatch...) 낯선 형태라고 해도 너무 헤맨 것 같아 아쉬웠다.

삽질의 연속이다...

'공부 > TIL' 카테고리의 다른 글

[TIL] (Vue) Vuelidate 라이브러리 validatiors 사용 시 $v.$invalid 값  (1) 2022.05.20
[TIL] 페이지 첫 접속 시 데이터 처리  (0) 2022.05.19
[TIL] Vue-MultiSelect  (0) 2022.05.18
[TIL] Postman 환경 변수로 token 설정 시 acessToken 에러  (0) 2022.05.18
VSC에서 .vue만 highlight 인식 안될 때  (0) 2022.05.11
'공부/TIL' 카테고리의 다른 글
  • [TIL] (Vue) Vuelidate 라이브러리 validatiors 사용 시 $v.$invalid 값
  • [TIL] 페이지 첫 접속 시 데이터 처리
  • [TIL] Vue-MultiSelect
  • [TIL] Postman 환경 변수로 token 설정 시 acessToken 에러
Ail_
Ail_
Ail_
log
Ail_
  • 분류 전체보기 (186)
    • 사설 (11)
      • 강연 (5)
      • * (3)
      • 회고 (3)
    • 공부 (139)
      • Just do it (3)
      • TIL (66)
      • Game Bootcamp (31)
      • Digital Twin Bootcamp (39)
    • 노션 (3)
    • 프로젝트 (26)
      • Game Bootcamp (1)
      • Digital Twin Bootcamp (21)
      • 경기청년 갭이어 (4)
    • 토이 프로젝트 (1)
      • 아쿠아오브 (1)

인기 글

최근 글

태그

  • Do it! 자료구조와 함께 배우는 알고리즘 입문 : 파이썬 편
  • 대시
  • 개발회고
  • 개발일지
  • 한입 크기로 잘라 먹는 타입스크립트
  • 부트캠프
  • 피격
  • 템플릿
  • 오블완
  • mysql 설치
  • 멋쟁이사자처럼
  • 공격
  • C#
  • 갭이어
  • 노션
  • 이펙트
  • 회고
  • 유니티 게임 개발
  • 유니티
  • SQL 첫걸음
  • Chat
  • unity
  • 경기갭이어
  • 인터랙티브 웹 UX·UI
  • 경기청년갭이어
  • SQL첫걸음
  • 2025
  • node.js
  • 티스토리챌린지
  • TypeScript

최근 댓글

전체
오늘
어제
hELLO · Designed By 정상우.
Ail_
[TIL] (오류) vue store의 action에서 data list를 새로 받아올 때 특정 값을 가진 data만 들어옴
상단으로

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.