码迷,mamicode.com
首页 > 其他好文 > 详细

vue2 图片选择组件,支持多选和拖放

时间:2020-05-16 10:39:47      阅读:94      评论:0      收藏:0      [点我收藏+]

标签:image   com   回调   ber   component   data-   code   log   pre   

https://github.com/bigggge/vu...

vue-image-uploader

Vue2 图片选择上传组件,支持多选和拖放

DEMO

Props

参数 类型 说明 默认值
maxSize Number 单张图片最大大小 3072
placeholder String 占位文字 点击上传图片
onChange Function 文件更改回调(参数:files)

Example

HTML:

  <div class="hello">
    <image-inputer :onChange="imgChange" :maxSize="maxSize" placeholder="选择图片"></image-inputer>
  </div>

JavaScript:

  import ImageInputer from ‘@/components/ImageInputer.vue‘

  export default {
    name: ‘hello‘,
    data () {
      return {
        maxSize: 3072
      }
    },
    components: {
      ImageInputer
    },
    methods: {
      imgChange (files) {
        if (files) {
          console.log(files)
        }
      }
    }
  }
</script>

vue2 图片选择组件,支持多选和拖放

标签:image   com   回调   ber   component   data-   code   log   pre   

原文地址:https://www.cnblogs.com/homehtml/p/12898927.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!