반응형

vue 3

Vue Sespnese에 관하여...

Vue3에서 제공하는 기능인데 컴포넌트에서 비동기 요청 시 데이터가 다 받아와진후 화면을 보여지고 싶을때 Suspense 를 사용하여 감싸주면 데이터요청시 특정 컴포넌트 or 화면을 보여지게 할 수 있는듯 하다. (데이터 로딩화면 처럼) 참고주소 Vue 3의 새로운 기능 - Suspense Vue 3의 새로운 기능 - Suspense Vue 3의 새로운 기능 - Suspense k1005.github.io 그러나 다른블로그에서는 다음과 같이 말 하기도 한다. 컴포넌트가 데이터를 받아오기 전까지 기본 컨텐츠를 표시할 수 있는 기능으로 2에서는 v-if, v-show를 사용해서 구현해야했다. 하지만 Suspense는 비동기적 컴포넌트의 로딩이 완료될 때까지 대체 컴포넌트를 그리는 방법을 제시한다. 하지만 아..

뷰(Vue) 2024.01.05

원쌤의 Vue.js 퀵스타트 책을 보았다(Vue3)_4

주 단위로 Vue 스터디를 진행했던 내용들을 그냥 개인적으로 정리하기 위해서 작성중인 글이다. 5장에 중요포인트는 주로 사용되는 이벤트를 보통 JS에서 많이 컨트롤 했었는데 그런부분들에 대해서 편의성 기능을 많이 넣어둔것 같다. 추후 사용시에 편리하게 사용 가능한 방법들에 대해서 보여주고 하는게 많았다. 이벤트 처리에 대한 설명이다. 주로 사용되는 부분들이 여기에 포함된다. KeyUp, keyPress, keyDown, click, doubleClick 등등 자바스크립트로 확인하던 부분들이 모두 여기에 들어간다. js로 특정 객체를 선택하여 이벤트를 걸지않고 onclick이벤트를 주던것과 동일하게 생각하면 될 듯 하다. 금액 : 입금 인출 계좌 잔고 : {{balance}} 위와 같은 코드가 있다고 할 ..

뷰(Vue) 2023.12.20

원쌤의 Vue.js 퀵스타트 책을 보았다(Vue3)_3

주 단위로 Vue 스터디를 진행했던 내용들을 그냥 개인적으로 정리하기 위해서 작성중인 글이다. 4장에 중요포인트는 실질적으로 주로 사용되는 data나 여러가지 기능을 제공하는 computed method watch등을 소개하고 사용방법을 알려주는 것인듯 하다. data옵션에 대해서 설명한다. 컴포넌트가 관리하고 추적해야 할 데이터를 등록하여 사용 한다. 리액트에서도 주로 재사용되는 단위를 컴포넌트라고 했었는데 동일한듯 보인다. Vue에서 제공하는 Data에 접근하거나 Vue Dev Tool 에서 보여지는 대상의 경우 모두 $로 시작한다. (ex $data) 다음과 같이 접근하여 사용가능하기 때문에 내부적으로 사용하는 변수들의 경우 $가 붙으면 안된다. data() { return { $name: "" }..

뷰(Vue) 2023.12.20
반응형