vue-image-base64

    0.1.0 • Public • Published

    vue版 图片转base64

    上传图片转base64

    1. event
      • @size-error 图片过大
      • @type-error 类型错误
      • @file-info 图片base64的信息
    2. props:
      • accept 图片类型
      • previewImage支持图片预览
      • maxSize 图片大小(M)
      • multiple多文件上传 --todo

    ### Usage

    <template>
    
    <image-to-base64
       :maxSize ='100/1024'
       :previewImage='previewImage'
       @file-info='reciveFileInfo'
       @size-error='sizeError'
       @type-error='typeError'
       class='upload-btn'>
    </image-to-base64>
    
    </template>
    
    
    <script>
    
     import imageToBase64 from 'imageToBase64';
     import upload from '..'
     export default {
    
       components: { imageToBase64 },
       data(){
           return {
               previewImage:true,//是否预览图片
           }
           },
       methods: {
         getFiles(files){
           console.log(files);
         },
           reciveFileInfo(v) {
               // console.log(v)
               this.fileInfo = v
               v &&  this.uploadImage() //上传
           },
           sizeError(v) {
               v && alert('图片过大')
           },
           typeError(v) {
               v && alert('类型错误')
           },
           uploadImage() {
               if (this.fileInfo) {
                   upload(this.fileInfo.base64).then( url => {
                       console.log(url)
                   })
                   .catch( err => {
                       console.log(err)
                   })
               }
           },
       }
     };
    
    </script>
    

    Install

    npm i vue-image-base64

    DownloadsWeekly Downloads

    2

    Version

    0.1.0

    License

    MIT

    Unpacked Size

    6.4 kB

    Total Files

    4

    Last publish

    Collaborators

    • gblw