Quasar 提供了v-ripple指令，您可以使用它轻松的为 DOM/组件添加一个 Material design 中的涟漪动画（点击元素后有一个水波效果）

用法

基础

着色

Material Ripple 默认采用文本的 CSS 颜色，但这是可配置的：

定位

您也可以配置涟漪效果从何处展开，默认从点击处展开，您可以配置始终从 DOM 中心展开：

提前触发

默认情况下，Ripple 指令在点击或按键时被触发。但是，您可以更改它并使其在第一次用户交互(mousedown, touchstart, keydown)时更早的触发。请注意，在大多数情况下，事件集可能会重叠(第一次和最后一次用户交互之间的小延迟)，用户的感知没有差异，但在某些情况下，这可能会导致误导用户。

这在触摸屏上尤其明显，如果用户在触控启动后不小心移动了手指，它有时会被解释为一个非常小的滚动事件，而不是点击事件，所以点击事件没有被触发，但仍然有一个波纹。

禁用

如果出于某些原因，您有一个场景需要禁用波纹，那么您可以为指令分配一个布尔值，来开启/禁用它