리플 디렉티브 (Ripple directive)

v-ripple 디렉티브는 사용자의 액션을 보여주는데 사용됩니다. 이 디렉티브는 어떤 블록 레벨 요소에든 적용될 수 있습니다. 다양한 컴포넌트들이 리플 디렉트브와 함께 사용될 수 있습니다. 예르 들어 v-btn, v-tabs-item 등과 더 많은 다양한 내장 컴포넌트들이 있습니다.

사용법

기본적으로 버튼은 리플이 활성화되어 있습니다. :ripple="false" prop으로 제거할 수도 있습니다.


API

v-ripple

예제

커스텀 색상 (Custom color)

헬퍼 클래스를 사용하여 리플의 색을 바꿀 수 있습니다.


탭 (Tabs)

기본적으로 탭은 리플이 비활성화 되어 있습니다. ripple prop으로 활성화할 수 있습니다.


네비게이션 서랍 (Navigation drawers)

기본적으로 리스트 아이템들은 리플이 비활성화 되어 있습니다. ripple prop으로 활성화할 수 있습니다.


툴바 (Toolbars)

툴바 아이템들은 기본적으로 리플이 비활성화 되어 있습니다. ripple prop으로 활성화할 수 있습니다.


확장패널 (Expansion panels)

확장패널은 기본적으로 리플이 비활성화 되어 있습니다. ripple prop으로 활성화할 수 있습니다.


컴포넌트 (Components)

여러 다른 컴포넌트들도 리플을 지원합니다. ripple prop으로 활성화할 수 있습니다.


표준 HTML 요소 (Standard HTML element)

표준 HTML 요소에 리플효과를 추가하세요. v-lipple 디렉티브로 활성화할 수 있습니다.