1. 문제 해석csv 파일을 불러와 vue에 모달창으로 사용해야 하는 업무가 있었습니다.회사 관련 코드이기에 자세하게 알려줄 수 없으나, 코드는 다음과 같습니다. upload.javapublic class Controller { @PostMapping("/test") public SingleResponse upload(MultipartFile file) { try { csvService.saveCsv(file); return responseService.createResponse(true); } catch (Exception e) { return responseService.createResponse(e.toS..
Vue.js에서 컴포넌트 간의 통신 방식은 부모-자식 관계, 형제 관계, 전역 상태 관리 등을 통해 이루어진다고 해요.그러면 이제, 주요 컴포넌트 통신 방식에 대해 알아봅시다! 1. PropsProps는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달할 때, 사용해요.자식 컴포넌트는 props 옵션을 사용하여, 부모로부터 전달된 데이터를 수신합니다.다음 코드와 같이 사용할 수 있어요. props.html --> 결과AppHeader안에 propsdata라는 속성으로 데이터 hi가 내려간 것을 확인할 수 있습니다. 이를 활용하여, 다음과 같이 여러 컴포넌트에 props 속성을 사용할 수 있습니다. -..
Vue.js에 대해 공부하던 중 전역 컴포넌트와 지역 컴포넌트에 대해 알게 되었습니다.이 두개의 컴포넌트가 어떤 차이가 있고 어떤 상황에 사용할 수 있는지 궁금하여, 더욱 자세히 알아보고자 해요! 1. 전역 컴포넌트(Global Components)전역 컴포넌트는 Vue 애플리케이션의 모든 인스턴스에서 사용할 수 있는 컴포넌트입니다.한 번 등록되면, 애플리케이션 어디서나 참조할 수 있어요.전역 컴포넌트는 여러 뷰 or 페이지에서 동일한 컴포넌트를 사용해야 할 때, 유리합니다.하지만, 너무 많은 전역 컴포넌트는 네임스페이스를 오염시킬 수 있으며, 애플리케이션의 초기 로딩 시간에 영향을 줄 수 있어요.. 전역 컴포넌트 등록 방법은 다음과 같습니다.Vue.component("컴포넌트 이름", 컴포넌트 내용);..
Vue.js를 공부하다가 MVVM 패턴에 대해 들어보신 적이 있으실 텐데요.MVVM 패턴이 무엇인지 알아봅시다! 1. MVVM 패턴MVVM 패턴은 Model-View-ViewModel 패턴이라고도 불립니다.이는 소프트웨어 아키텍처 디자인 패턴 중 하나로, 주로 GUI 애플리케이션 개발에서 사용됩니다.이 패턴은 코드의 유지보수성과 재사용성을 높이고, 테스트를 용이하게 하며, UI와 비즈니스 로직을 분리하는 데 도움을 줍니다. 2. 구성요소각 구성요소와 어떤 역할을 하는지에 대해 알아봅시다!1) Model(모델)Model은 애플리케이션의 데이터와 비즈니스 로직을 담당합니다.DB, 웹 서비스와의 상호작용 등을 처리합니다.ViewModel에 의해 데이터가 변경되거나, 저장소로부터 데이터를 불러옵니다. 2) Vi..