vue-upload-imgsvue 图片上传组件

vue-upload-imgs 上传组件保存的是图片的 base64 码。

在线 demo

• 预览模式


• 列表模式


• 禁用

文档

使用

在单文件组件中引用

npm i vue-upload-imgs

import Vue from 'vue'

import VueUploadImgs from 'vue-upload-imgs'



Vue.use(VueUploadImgs)

<template>

    <div>

        <VueUploadImgs 

            multiple

            compress

            :before-read="beforeRead"

            :after-read="afterRead"

            :before-remove="beforeRemove"

            :limit="limit"

            :type="type"

            @preview="preview"

            @exceed="exceed"

            @oversize="oversize"

            v-model="files"

        >

        </VueUploadImgs>

    </div>

</template>

在HTML文件中直接引用

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<script src="../dist/vueUploadImgs.umd.min.js"></script>

<div id="app">

    <vue-upload-imgs 

        multiple

        compress

        :before-read="beforeRead"

        :after-read="afterRead"

        :before-remove="beforeRemove"

        :limit="limit"

        :type="type"

        @preview="preview"

        @exceed="exceed"

        @oversize="oversize"

        v-model="files"

    >

    </vue-upload-imgs>

</div>