直播app开发，基于van-uploader封装的文件上传图片压缩组件

直播app开发，基于van-uploader封装的文件上传图片压缩组件

1、调用

<template>
    <div>
        <compress-uploader v-model="fileList" :compressSwitch="true" :quality="0.5" :maxCount="3" />
    </div>
</template>
 
<script>
import compressUploader from './components/compress-uploader'
export default {
  name: 'CompShip',
  data () {
    return {
      fileList: [],
    }
  },
  components: {
    compressUploader
  }
}
</script>
 
<style scoped> 
</style>

​2、核心代码

<template>
  <van-uploader :fileList="fileList" :after-read="afterRead"
    multiple :max-count="maxCount" v-bind="$attrs" v-on="$listeners" />
</template>
 
<script>
export default {
  name: 'compress-uploader',
  props: {
    value: Array,
    quality: {
      type: Number,
      default: 0.1
    },
    compressSwitch: {
      type: Boolean,
      default: false
    },
    threshold: {
      type: Number,
      default: 500
    },
    maxCount: {
      type: Number,
      default: 1
    }
  },
  computed: {
    fileList: {
      get () {
        return this.value
      },
      set (n) {
        this.$emit('input', n)
      }
    }

 以上就是 直播app开发，基于van-uploader封装的文件上传图片压缩组件，更多内容欢迎关注之后的文章