• 로그인
  • 장바구니에 상품이 없습니다.

home2 게시판 Vue 게시판 개별 컴포넌트로 라우팅 접근시 axios데이터

개별 컴포넌트로 라우팅 접근시 axios데이터

5 글 보임 - 1 에서 5 까지 (총 5 중에서)
  • 글쓴이
  • #15654

    쿨백스
    참가자

    안녕하세요

    서버와 axios 통신으로 약 3가지 다른 종류의 DB 데이터를 받아와서

    3개의 차트를 그려주는 하나의 페이지를 만든다고 할때

    개별 차트 자체를 컴포넌트로 구현하여 소스를 구성할 수 있어 보이는데요

     

    만약 라우팅 기능을 넣어서 하나의 차트만 볼 수 있는 경로를 만든다고 하면

    axios 데이터 통신 코드가 개별 컴포넌트 코드 안에 각각 구현이 되어야 할까요?

     

    그리고 만약 개별 aixos로 각각 통신하여 개별 작업을 하게 짜는 것이

    페이지 입장에서 보면 흔히 말하는 멀티 프로세싱과 같이

    속도나 부하측면에서 더 좋은 방법이 될 수 있을까요?

    #15655

    codingapple
    키 마스터

    네 차트1개 페이지부터 접속할 수도 있으니 

    아마 차트1개 페이지 안에서도 axios 요청을 해야겠죠 

    DB하나에서 3개 데이터를 뽑아오는거면 3번 요청할 필요 없습니다 1번요청에 데이터 3개 다 가져올 수 있으니까요 

    ajax 요청 횟수가 줄어들 수록 서버에 부담이 줄어듭니다

     

     

    #15658

    쿨백스
    참가자

    댓글 감사합니다. 추가 질의 한번 더 드리고자 합니다^^

     

    1. 말씀하신대로 3개 데이터를 뽑을 수 있어서 라우팅 및 컴포넌트 내부에 axios를 코드를 작성하여 

    1회 요청으로 3개 데이터를 모두 가져왔다고 한다면, 다른 이동 시 ajax재요청 시키지 않기 위해서 데이터를

    vuex 등으로 공유를 해야하는 방식이 되는건가요?

     

    2. 한번에 처리가 되도 위처럼 구조가 잡히면 데이터 이동이 뭔가 복잡한 느낌도 있는데

    차라리 개별접근 고려 안하여 라우팅 안하고,  App.vue에서 3개 데이터 한번에 뽑게 한뒤

    Props로 넘기는게 가장 심플한 접근일까요?

     

    3. 상황이 위와 달리 3개 DB에서 각각 3개 쿼리를 날려야 한다고 하면

     각 컴포넌트에서 각각 axios 호출하여 쿼리 결과 받는 방법이 맞다고 보면 될까요?

    #15661

    codingapple
    키 마스터

    1. 가져온 데이터가 App.vue에 저장이 되어있는데

    다른 컴포넌트에서 그걸 쓰고 싶으면 props 이런걸로 보내거나 vuex안에 보관하거나 그러면 되겠군요 

     

    2. 그냥 현재 보여줘야하는게 1개면 1개, 3개면 3개 가져오면 됩니다 

    한번에 다 가져오고 싶으면 App.vue에서 3개 한번에 가져오고

    다른 컴포넌트에서 쓰고 싶어지면 props 그런걸로 보내면 됩니다 

     

    3. DB와 직접 통신하는건 서버입니다 html -> 서버 -> DB 인데 

    서버에서 DB 3개에서 데이터 한번에 가져오라고 코드를 짜놓을 수도 있고 

    서버에서 개별 DB와 각각 하나씩 통신하는 API를 만들어놓을 수도 있겠군요

    작동 잘되면 어떻게 하든 다 맞는 방법입니다 효율적 비효율적 이런건 갈릴 수 있겠지만요 

     

    #15665

    쿨백스
    참가자

    상세한 답변 감사드립니다!

5 글 보임 - 1 에서 5 까지 (총 5 중에서)
  • 답변은 로그인 후 가능합니다.

About

현재 월 700명 신규수강중입니다.

  (09:00~20:00) 빠른 상담은 카톡 플러스친구 코딩애플 (링크)
  admin@codingapple.com
  이용약관
ⓒ Codingapple, 강의 예제, 영상 복제 금지
top

© Codingapple, All rights reserved. 슈퍼로켓 에듀케이션 / 서울특별시 강동구 고덕로 19길 30 / 사업자등록번호 : 212-26-14752 온라인 교육학원업 / 통신판매업신고번호 : 제 2017-서울강동-0002 호 / 개인정보관리자 : 박종흠