vuekeep-alive의 간단한 요약

1641 단어 vuekeep-alive

역할


주로 어셈블리 상태를 유지하거나 렌더링을 피하는 데 사용됩니다.

2. 용법


동적 구성 요소를 감싸면 사용하지 않는 구성 요소의 실례를 캐시합니다. 삭제하지 않습니다.
는 추상적인 구성 요소입니다. 그 자체는 DOM 요소를 렌더링하지 않고 구성 요소의 부모 구성 요소 체인에 나타나지 않습니다.
구성 요소가 에서 전환되면,activated와deactivated 두 생명주기 갈고리 함수가 실행됩니다.

3. Props


include


include - 문자열 또는 정규 표현식.이름이 일치하는 구성 요소만 캐시됩니다.

exclude


exclude - 문자열 또는 정규 표현식.이름이 일치하는 구성 요소는 캐시되지 않습니다.
include와 excludeprop은 구성 요소의 조건부 캐시를 허용합니다.둘 다 문자열, 정규 표현식 또는 하나의 그룹을 쉼표로 구분할 수 있습니다.

<!--   -->
<keep-alive include="a,b">
 <component :is="view"></component>
</keep-alive>

<!--   (  `v-bind`) -->
<keep-alive :include="/a|b/">
 <component :is="view"></component>
</keep-alive>

<!--   (  `v-bind`) -->
<keep-alive :include="['a', 'b']">
 <component :is="view"></component>
</keep-alive>
일치 우선 구성 요소 자체의name 옵션을 검사합니다.name 옵션을 사용할 수 없으면 로컬 등록 이름 (부부 구성 요소components 옵션의 키 값) 과 일치합니다.익명 구성 요소는 일치할 수 없습니다.

max


max - 숫자.최대 몇 개의 구성 요소 실례를 캐시할 수 있습니까?
이 숫자가 도착하면 새 실례가 만들어지기 전에 캐시된 구성 요소 중 가장 오랫동안 접근하지 않은 실례가 삭제됩니다.

<keep-alive :max="10">
 <component :is="view"></component>
</keep-alive>
이상은 vue의keep-alive에 대한 상세한 내용을 간단히 분석하고, vue의keep-alive에 대한 더 많은 자료는 저희 다른 관련 문장에 주목하세요!

좋은 웹페이지 즐겨찾기