Ripple

Material Design 水波纹效果指令

引入

import Ripple from 'vue-pmui';
Vue.directive(Ripple.name, Ripple);

例子

 <button v-ripple>{{msg}}</button>
 <button v-ripple="{color:'#222',duration:500}">{{msg}}</button>

配置

 {
   class: '', // 动画效果元素容器类名
   center: false, // 是否固定从元素中心开始动画
   duration: 400, // 效果持续时间  (单位: ms)
   color: 'currentColor', // 波纹的颜色，默认为字体颜色
   radius: '', // 波纹半径，默认为元素width和height的最大值
 }