vue-sound-wave/README.md

> node v18+

#### node版本
> node v18+

#### 启动项目
> npm i vue-sound-wave

#### 使用示例
```html
<script setup>
import { ref } from 'vue';
import SoundWave from 'vue-sound-wave';
const mkRef = ref(null);
const isRecord = ref(false);
const handleToggle = () => {
  mkRef.value.togglePlay();
  isRecord.value = !isRecord.value;
};

</script>

<template>
 <button @click="handleToggle">发送语音</button>
 <SoundWave ref="mkRef" :isRecord="isRecord"></SoundWave>
</template>

<style scoped>
</style>

```

#### 基础可选配置
```js
// 是否开启
isRecord: false,
// 遮罩层样式
overlayStyle:{
    background: 'rgba(0, 0, 0, 0.15)',
    width: '150px',
    height: '50px',
    minWidth: '150px',
    padding: '15px 10px',
    boxSizing:'border-box',
},
// 声音样式
waveOptions:{
    waveColor: "#4CAF50",
    progressColor: "#52C41A",
    height: 20,
    barWidth: 2,
    barGap: 3,
    barRadius: 2,
    barMinHeight: 1,
    normalize: true,
    interact: false,
    fillParent: true,
    pixelRatio: 1,
    minPxPerSec: 50,
    cursorWidth: 0,
    responsive: true,
    partialRender: true,
    removeMediaControl: true,
    hideScrollbar: true,
}
```

#### 说明
> 该插件包是基于vue3.0 + wavesurferJs进行二开，只针对麦克风音波效果开发，不做音频文件导出，如有需要请自行封装。

#### 效果图
[效果图](https://i-blog.csdnimg.cn/direct/de8369221c3d47c989c6420a6d68beb8.png)

#### 源码地址
[源码地址](git@github.com:gaojizu/recordSoundWave.git)