波纹效果(Ripple effect)
made with Vuejs

波纹效果(Ripple effect)是一个实现Material设计风格的纹波效果的插件，支持向任何Vue元素添加Google Material设计波纹效果，无依赖。

安装

Npm

npm i vue-material-design-ripple

Yarn

yarn add vue-material-design-ripple

使用

引入并注册

import Ripple from "vue-material-design-ripple";
import "vue-material-design-ripple/dist/vue-material-design-ripple.css";

Vue.directive("ripple", Ripple);

<div class="clickme" :style="{color}" v-ripple="{center,class: rippleClass}">
        <div class="clickme-text">
          <span class="hash" v-if="showHash">#</span>
          {{btnLabel}}
        </div>
      </div>

示例