0.1.4 • Published 4 years ago

mh-wave v0.1.4

Weekly downloads
3
License
MIT
Repository
github
Last release
4 years ago

mh-wave

install

npm install mh-wave
yarn add mh-wave

Usage

作为插件使用

import Vue from 'vue'

import VueWave from 'mh-wave'



Vue.use(VueWave)

局部注册组件

<template>
  <single-wave :rate="rate" />
  <double-wave :rate="rate" />
</template>
import { SingleWave, DoubleWave } from 'mh-wave'

new Vue({
    el: '#root',
    components: {
        SingleWave,
        DoubleWave
    },

    data: {
        rate: 50
    }

})

SingleWave

props

NameTypeDefaultDesctiption
rateNumber0比例值
gapNumber/String5内外圆间距
widthNumber/String100悬浮球宽度
borderColorStringgreen边框颜色
borderWidthNumber/String3边框宽度
waveColorString/Functiongreen波浪颜色,设置为Function时,可接收rate为参数,根据rate设置颜色
justifyContentStringcenter
alignItemsStringcenter

DoubleWave

props

NameTypeDefaultDescription
rateNumber0比例值
waveRadiusNumber/String70px水波半径
circleHeightNumber/String200px圆球高度
waveColorString/Functiongreen波浪颜色,设置为Function时,可接收rate为参数,根据rate设置颜色
initialColorString#fffrate为0时的颜色
fullRateNumber100最大rate值
0.1.4

4 years ago

0.1.3

4 years ago

0.1.2

4 years ago

0.1.1

4 years ago

0.1.0

4 years ago