728x90
반응형

2024/10/23 2

[콜럼Vue스] 지연로딩

Vue에서는 동적 import() 함수를 사용하여 컴포넌트를 지연 로딩할 수 있다.이렇게 하면 컴포넌트가 실제로 필요할 때 로딩이 이루어지기 때문에 애플리케이션의 초기 로딩 속도가 빨라진다. 요약지연 로딩은 컴포넌트나 리소스를 필요한 시점에 로딩하여 애플리케이션의 성능을 최적화하는 기법임.**동적 import()**를 통해 컴포넌트 지연 로딩을 쉽게 적용할 수 있음.Suspense 컴포넌트는 비동기 컴포넌트의 로딩 상태를 관리할 때 유용하며, fallback 슬롯을 통해 로딩 화면을 제공할 수 있음. 1. 동적 import()를 사용한 지연 로딩// router/index.jsimport { createRouter, createWebHistory } from 'vue-router';const routes..

[콜럼Vue스] 라우트 정보를 속성으로 연결하기

Vue Router에서 라우트 정보를 속성으로 연결하는 방법은 컴포넌트나 를 통해서 컴포넌트 간에 라우트 관련 정보를 주고받는 방식으로 이루어짐. 특히 동적 라우팅이나 라우트 매칭 정보를 컴포넌트에서 사용하고자 할 때, 이러한 방법을 자주 사용함.요약props 옵션을 사용하여 라우트 파라미터나 쿼리를 컴포넌트에 전달할 수 있음.****를 통해 라우트 경로에 동적 값을 전달하여 링크를 생성 가능.$route 객체로 라우트 정보를 직접 접근할 수도 있지만, props로 전달하는 것이 더 구조적으로 깔끔하고 권장됨.1. 라우트 정보를 속성으로 연결하기Vue Router를 사용할 때 라우트 정보를 컴포넌트에 전달하고, 해당 정보를 props를 통해 연결하여 컴포넌트 내부에서 처리할 수 있음.1.1. props..

728x90
반응형