계란 블로그

  • 홈
  • 태그
  • 방명록

Vue.js 3 상위 하위 데이터 전달 1

[12월 5주차] Vue.js 3 상위 컴포넌트 ↔ 하위 컴포넌트 데이터 전달 방법

얼마 전부터 회사에서 IoT 관련 웹 페이지를 만들고 있습니다. 그림과 같이 최상위 컴포넌트(Page) 안에 검색 컴포넌트(SearchForm)와 목록 컴포넌트(List)가 있고 그 안에 또 자식 컴포넌트(Modify)가 있는 형태입니다. 검색폼에 조건을 넣어서 조회하던 도중, 디바이스 정보를 등록하거나 수정한 다음, (검색 조건을 그대로 적용한) 새로운 목록이 조회되는 기능을 만들려고합니다. 그러기 위해서는 검색 정보(searchInfo)를 Page로 전달하고 또 다시 하위로 전달하는 구조가 필요합니다. Vue.js 3에서 컴포넌트 간에 데이터를 주고 받는 방법을 정리하며 살펴보겠습니다. 하위 컴포넌트(DeviceSearchForm) → 상위 컴포넌트(Page) 데이터 보내기 DeviceSearchFo..

개발 일지 2023.12.31
이전
1
다음
더보기
프로필사진

Web Developer lan4250@naver.com https://github.com/goraneee

  • 분류 전체보기 (428)
    • 개발 일지 (3)
      • 주간 개발 일지 (18)
      • Apache Kafka (3)
    • 강의 사이트 만들기 (7)
    • Spring Framework (39)
      • [인프런] 실전! QueryDSL (6)
      • [인프런] Java ORM 표준 프로그래밍 - J.. (11)
      • [인프런] Spring Security & OAu.. (3)
      • [인프런] Spring 핵심 원리 (9)
      • 토비의 스프링 (10)
    • 디자인 패턴 (Design Pattern) (7)
    • Java (82)
      • 스프링 입문을 위한 자바 객체 지향의 원리와 이해 (3)
      • Java의 정석 (16)
      • 모두의 자바 (63)
    • Boot Camp (14)
      • [zerobase] 스쿨선발대 수강 후기 (6)
      • [코드스쿼드] Java 백엔드 테스트 (4)
      • [우테코] 프리코스 (4)
    • FrontEnd (25)
      • HTML + CSS + 자바스크립트 웹 표준의 정.. (0)
      • [zerobase] JavaScript (1)
      • Vue.js 3 (5)
      • Vue를 이용한 웹 게임 만들기 (4)
      • 모던 자바스크립트 deep dive (4)
    • 자료구조와 알고리듬 With Java (70)
      • [Study] BAEKJOON 프로그래머스 Cod.. (40)
      • [zerobase] Algorithm (7)
      • [인프런] Algorithm (8)
      • [프로그래머스] Algorithm (12)
      • [프로그래머스] KDC (2)
    • 컴퓨터 과학 (79)
      • [Study] Real MySQL 8.0 (13)
      • [프로그래머스] SQL DB Essentials (16)
      • [프로그래머스 & Leet Code] MySQL .. (7)
      • [zerobase] 컴퓨터 공학 (4)
      • [zerobase] Git & GItHub (8)
      • [인프런: 얄팍한 코딩사전] Git & GitHu.. (6)
      • C Language (25)
    • Spring Projcect (63)
      • [팀플] In & Out 가계부 (11)
      • 계좌 관리 시스템 프로젝트 (6)
      • 학습 관리 시스템 & 백오피스 구축 (17)
      • 날씨 일기 프로젝트 (10)
      • 배당금 프로젝트 (8)
      • [갠플] Online-mall (9)
      • E-commerce (2)
    • Book Study (1)
      • Clean Code (1)
    • 백엔드 개발직 면접 예상 질문 (7)
    • Infra (1)
    • 자격증 (3)

Tag

데이터베이스, 코드업, dfs, 백준, Java, Queue, BFS, 스프링, 프로그래머스, Stack, mysql, JPA, 알고리즘, GIT, 제로베이스 백엔드, SQL, DB, 제로베이스 스쿨, 자바, dp,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/05   »
일 월 화 수 목 금 토
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

  • GitHub
  • velog

티스토리툴바