webpackJsonp([48],{Y8qW:function(t,s){t.exports={render:function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("section",[a("h2",{attrs:{id:"Upload"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Upload-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Upload")]),t._v(" "),t._m(0),t._v(" "),t._m(1),t._v(" "),t._m(2),t._v(" "),t._m(3),t._v(" "),a("h3",{attrs:{id:"Example"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Example-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Example")]),t._v(" "),t._m(4),t._v(" "),a("h3",{attrs:{id:"Propsconfiguration"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Propsconfiguration-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Props configuration")]),t._v(" "),t._m(5),t._v(" "),t._m(6),t._v(" "),t._m(7),t._v(" "),t._m(8),t._v(" "),t._m(9),t._v(" "),t._m(10),t._v(" "),a("h3",{attrs:{id:"Events"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Events-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Events")]),t._v(" "),t._m(11),t._v(" "),a("h3",{attrs:{id:"Instancemethods"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Instancemethods-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Instance methods")]),t._v(" "),t._m(12)])},staticRenderFns:[function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("blockquote",[a("p",[t._v("New in 1.3.0+")])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("p",[a("code",{pre:!0},[t._v("Upload")]),t._v(" component.")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("p",[a("strong",[t._v("Notice:")]),t._v(" In this document, all the original File will be called "),a("strong",[t._v("original file")]),t._v(", since the wrapped file object will be called "),a("strong",[t._v("file object")]),t._v(". The structure of "),a("strong",[t._v("file object")]),t._v(" show as following:")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("Attribute")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Type")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("v-model")]),t._v(" "),a("td",[t._v("file list")]),t._v(" "),a("td",[t._v("Array")])]),t._v(" "),a("tr",[a("td",[t._v("name")]),t._v(" "),a("td",[t._v("file name")]),t._v(" "),a("td",[t._v("String")])]),t._v(" "),a("tr",[a("td",[t._v("size")]),t._v(" "),a("td",[t._v("file size")]),t._v(" "),a("td",[t._v("Number")])]),t._v(" "),a("tr",[a("td",[t._v("url")]),t._v(" "),a("td",[t._v("file url, created by URL.createObjectURL, for preview")]),t._v(" "),a("td",[t._v("String")])]),t._v(" "),a("tr",[a("td",[t._v("base64")]),t._v(" "),a("td",[t._v("file base64 value, the value is equaled to the original file's base64 value. It is "),a("code",{pre:!0},[t._v("''")]),t._v(" by default, but you can have some plugins to added this "),a("code",{pre:!0},[t._v("base64")]),t._v(" value, like the compress plugin below")]),t._v(" "),a("td",[t._v("String")])]),t._v(" "),a("tr",[a("td",[t._v("status")]),t._v(" "),a("td",[t._v("file status, one of: ready, uploading, success, error")]),t._v(" "),a("td",[t._v("String")])]),t._v(" "),a("tr",[a("td",[t._v("progress")]),t._v(" "),a("td",[t._v("file progress, number 0~1")]),t._v(" "),a("td",[t._v("Number")])]),t._v(" "),a("tr",[a("td",[t._v("file")]),t._v(" "),a("td",[t._v("the original file")]),t._v(" "),a("td",[t._v("File")])]),t._v(" "),a("tr",[a("td",[t._v("response")]),t._v(" "),a("td",[t._v("response data(try to parse to JSON）")]),t._v(" "),a("td",[t._v("Object/Array/String")])]),t._v(" "),a("tr",[a("td",[t._v("responseHeaders")]),t._v(" "),a("td",[t._v("all response headers")]),t._v(" "),a("td",[t._v("String")])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("p",[t._v("Basic usage")]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload")]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("action")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"//jsonplaceholder.typicode.com/photos/"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":simultaneous-uploads")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"1"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("@files-added")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"filesAdded"')]),t._v(" />")]),t._v("\n")])]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[t._v("export")]),t._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("default")]),t._v(" {\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("methods")]),t._v(": {\n    filesAdded(files) {\n      "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("const")]),t._v(" maxSize = "),a("span",{attrs:{class:"hljs-number"}},[t._v("1")]),t._v(" * "),a("span",{attrs:{class:"hljs-number"}},[t._v("1024")]),t._v(" * "),a("span",{attrs:{class:"hljs-number"}},[t._v("1024")]),t._v(" "),a("span",{attrs:{class:"hljs-comment"}},[t._v("// 1M")]),t._v("\n      "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("for")]),t._v(" ("),a("span",{attrs:{class:"hljs-keyword"}},[t._v("let")]),t._v(" k "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("in")]),t._v(" files) {\n        "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("const")]),t._v(" file = files[k]\n        "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("if")]),t._v(" (file.size > maxSize) {\n          file.ignore = "),a("span",{attrs:{class:"hljs-literal"}},[t._v("true")]),t._v("\n        }\n      }\n    }\n  }\n}\n")])]),t._v(" "),a("p",[t._v("Set "),a("code",{pre:!0},[t._v("action")]),t._v(" to configure the upload target URL for the multipart POST request.")]),t._v(" "),a("p",[t._v("Set "),a("code",{pre:!0},[t._v("simultaneous-uploads")]),t._v(" to configure the max number of files uploading simultaneously .")]),t._v(" "),a("p",[t._v("The "),a("code",{pre:!0},[t._v("files-added")]),t._v(" event is used for file validation, and you can filter file by setting "),a("code",{pre:!0},[t._v("file.ignore = true")]),t._v(".")])]),t._v(" "),a("li",[a("p",[t._v("Compress and uploaded through Base64")]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload")]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("ref")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"upload"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":action")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"action"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":simultaneous-uploads")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"1"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":process-file")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"processFile"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("@file-submitted")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"fileSubmitted"')]),t._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload")]),t._v(">")]),t._v("\n")])]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[t._v("import")]),t._v(" compress "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("from")]),t._v(" "),a("span",{attrs:{class:"hljs-string"}},[t._v("'../../modules/image'")]),t._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[t._v("export")]),t._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("default")]),t._v(" {\n  data() {\n    "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("return")]),t._v(" {\n      "),a("span",{attrs:{class:"hljs-attr"}},[t._v("action2")]),t._v(": {\n        "),a("span",{attrs:{class:"hljs-attr"}},[t._v("target")]),t._v(": "),a("span",{attrs:{class:"hljs-string"}},[t._v("'//jsonplaceholder.typicode.com/photos/'")]),t._v(",\n        "),a("span",{attrs:{class:"hljs-attr"}},[t._v("prop")]),t._v(": "),a("span",{attrs:{class:"hljs-string"}},[t._v("'base64Value'")]),t._v("\n      }\n    }\n  },\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("methods")]),t._v(": {\n    processFile(file, next) {\n      compress(file, {\n        "),a("span",{attrs:{class:"hljs-attr"}},[t._v("compress")]),t._v(": {\n          "),a("span",{attrs:{class:"hljs-attr"}},[t._v("width")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("1600")]),t._v(",\n          "),a("span",{attrs:{class:"hljs-attr"}},[t._v("height")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("1600")]),t._v(",\n          "),a("span",{attrs:{class:"hljs-attr"}},[t._v("quality")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("0.5")]),t._v("\n        }\n      }, next)\n    },\n    fileSubmitted(file) {\n      file.base64Value = file.file.base64\n    }\n  }\n}\n")])]),t._v(" "),a("p",[t._v("The "),a("code",{pre:!0},[t._v("action")]),t._v(" is an object which contains "),a("code",{pre:!0},[t._v("target")]),t._v(" and "),a("code",{pre:!0},[t._v("prop")]),t._v(". the "),a("code",{pre:!0},[t._v("prop")]),t._v(" could configure which property  in file object will be uploaded).")]),t._v(" "),a("p",[t._v("The "),a("code",{pre:!0},[t._v("process-file")]),t._v(" is a function which is used to process the original file, like compress, "),a("code",{pre:!0},[t._v("next")]),t._v(" must be called with the processed file.")]),t._v(" "),a("p",[t._v("The "),a("code",{pre:!0},[t._v("file-submitted")]),t._v(" event will be trigged after the file is processed and added to the "),a("code",{pre:!0},[t._v("upload.files")]),t._v(" with a parameter -- the file object.")])]),t._v(" "),a("li",[a("p",[t._v("Use slots")]),t._v(" "),a("p",[t._v("You can use slots to define your custom HTML structure.")]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload")]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("ref")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"upload"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("v-model")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"files"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":action")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"action"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("@files-added")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"addedHandler"')]),t._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("@file-error")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"errHandler"')]),t._v(">")]),t._v("\n  "),a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("div")]),t._v(" "),a("span",{attrs:{class:"hljs-attr"}},[t._v("class")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"clear-fix"')]),t._v(">")]),t._v("\n    "),a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload-file")]),t._v(" "),a("span",{attrs:{class:"hljs-attr"}},[t._v("v-for")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"(file, i) in files"')]),t._v(" "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":file")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"file"')]),t._v(" "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":key")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"i"')]),t._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload-file")]),t._v(">")]),t._v("\n    "),a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload-btn")]),t._v(" "),a("span",{attrs:{class:"hljs-attr"}},[t._v(":multiple")]),t._v("="),a("span",{attrs:{class:"hljs-string"}},[t._v('"false"')]),t._v(">")]),t._v("\n      "),a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("div")]),t._v(">")]),t._v("\n        "),a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("i")]),t._v(">")]),t._v("＋"),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("i")]),t._v(">")]),t._v("\n        "),a("span",{attrs:{class:"hljs-tag"}},[t._v("<"),a("span",{attrs:{class:"hljs-name"}},[t._v("p")]),t._v(">")]),t._v("Please click to upload ID card"),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("p")]),t._v(">")]),t._v("\n      "),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("div")]),t._v(">")]),t._v("\n    "),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload-btn")]),t._v(">")]),t._v("\n  "),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("div")]),t._v(">")]),t._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[t._v("</"),a("span",{attrs:{class:"hljs-name"}},[t._v("cube-upload")]),t._v(">")]),t._v("\n")])]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[t._v("export")]),t._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("default")]),t._v(" {\n  data() {\n    "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("return")]),t._v(" {\n      "),a("span",{attrs:{class:"hljs-attr"}},[t._v("action")]),t._v(": "),a("span",{attrs:{class:"hljs-string"}},[t._v("'//jsonplaceholder.typicode.com/photos/'")]),t._v(",\n      "),a("span",{attrs:{class:"hljs-attr"}},[t._v("files")]),t._v(": []\n    }\n  },\n  "),a("span",{attrs:{class:"hljs-attr"}},[t._v("methods")]),t._v(": {\n    addedHandler() {\n      "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("const")]),t._v(" file = "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("this")]),t._v(".files["),a("span",{attrs:{class:"hljs-number"}},[t._v("0")]),t._v("]\n      file && "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("this")]),t._v(".$refs.upload.removeFile(file)\n    },\n    errHandler(file) {\n      "),a("span",{attrs:{class:"hljs-comment"}},[t._v("// const msg = file.response.message")]),t._v("\n      "),a("span",{attrs:{class:"hljs-keyword"}},[t._v("this")]),t._v(".$createToast({\n        "),a("span",{attrs:{class:"hljs-attr"}},[t._v("type")]),t._v(": "),a("span",{attrs:{class:"hljs-string"}},[t._v("'warn'")]),t._v(",\n        "),a("span",{attrs:{class:"hljs-attr"}},[t._v("txt")]),t._v(": "),a("span",{attrs:{class:"hljs-string"}},[t._v("'Upload fail'")]),t._v(",\n        "),a("span",{attrs:{class:"hljs-attr"}},[t._v("time")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("1000")]),t._v("\n      }).show()\n    }\n  }\n}\n")])]),t._v(" "),a("p",[t._v("Custom Style:")]),t._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-stylus"}},[a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload")]),t._v("\n  "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload-file")]),t._v(", "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload-btn")]),t._v("\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("margin")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("0")]),t._v("\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("height")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("200px")]),t._v("\n  "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload-file")]),t._v("\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("margin")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("0")]),t._v("\n    + "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload-btn")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("margin-top")]),t._v(": -"),a("span",{attrs:{class:"hljs-number"}},[t._v("200px")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("opacity")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("0")]),t._v("\n  "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload-file-def")]),t._v("\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("width")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("100%")]),t._v("\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("height")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("100%")]),t._v("\n    "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cubeic-wrong")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("display")]),t._v(": none\n  "),a("span",{attrs:{class:"hljs-selector-class"}},[t._v(".cube-upload-btn")]),t._v("\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("display")]),t._v(": flex\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("align-items")]),t._v(": center\n    "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("justify-content")]),t._v(": center\n    > "),a("span",{attrs:{class:"hljs-selector-tag"}},[t._v("div")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("text-align")]),t._v(": center\n    "),a("span",{attrs:{class:"hljs-selector-tag"}},[t._v("i")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("display")]),t._v(": inline-flex\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("align-items")]),t._v(": center\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("justify-content")]),t._v(": center\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("width")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("50px")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("height")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("50px")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("margin-bottom")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("20px")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("font-size")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("32px")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("line-height")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("1")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("font-style")]),t._v(": normal\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("color")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("#fff")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("background-color")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("#333")]),t._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[t._v("border-radius")]),t._v(": "),a("span",{attrs:{class:"hljs-number"}},[t._v("50%")]),t._v("\n")])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("Attribute")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Type")]),t._v(" "),a("th",[t._v("Accepted Values")]),t._v(" "),a("th",[t._v("Demo")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("v-model")]),t._v(" "),a("td",[t._v("file list")]),t._v(" "),a("td",[t._v("Array")]),t._v(" "),a("td",[t._v("[]")]),t._v(" "),a("td",[t._v("[{ name, size, url, status: 'success', progress: 1 }]")])]),t._v(" "),a("tr",[a("td",[t._v("action")]),t._v(" "),a("td",[t._v("upload action config")]),t._v(" "),a("td",[t._v("String/Object")]),t._v(" "),a("td",[t._v("''")]),t._v(" "),a("td",[t._v("{ target: '/upload' }")])]),t._v(" "),a("tr",[a("td",[t._v("max")]),t._v(" "),a("td",[t._v("max upload files number")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("10")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("auto")]),t._v(" "),a("td",[t._v("whether auto start upload")]),t._v(" "),a("td",[t._v("Boolean")]),t._v(" "),a("td",[t._v("true")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("simultaneousUploads")]),t._v(" "),a("td",[t._v("the number of simultaneous uploads")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("1")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("multiple")]),t._v(" "),a("td",[t._v("multiple select")]),t._v(" "),a("td",[t._v("Boolean")]),t._v(" "),a("td",[t._v("true")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("accept")]),t._v(" "),a("td",[t._v("input accept")]),t._v(" "),a("td",[t._v("String")]),t._v(" "),a("td",[t._v("image/*")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("processFile")]),t._v(" "),a("td",[t._v("process the original file")]),t._v(" "),a("td",[t._v("Function")]),t._v(" "),a("td",[t._v("function (file, next) { next(file) }")]),t._v(" "),a("td",[t._v("-")])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("code",{pre:!0},[t._v("action")]),t._v(" sub configuration")])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("p",[t._v("If "),a("code",{pre:!0},[t._v("action")]),t._v(" is a string, it will be transformed into "),a("code",{pre:!0},[t._v("{ target: action }")]),t._v(".")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("Attribute")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Type")]),t._v(" "),a("th",[t._v("Default")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("target")]),t._v(" "),a("td",[t._v("the upload target URL for the multipart POST request, if this value is a function, then it will be called with the file object as parameter and the returned value as the URL")]),t._v(" "),a("td",[t._v("String/Function"),a("sup",[t._v("1.11.0+")])]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("fileName")]),t._v(" "),a("td",[t._v("the name of the multipart POST parameter")]),t._v(" "),a("td",[t._v("String")]),t._v(" "),a("td",[t._v("'file'")])]),t._v(" "),a("tr",[a("td",[t._v("prop")]),t._v(" "),a("td",[t._v("which property in file object will be uploaded")]),t._v(" "),a("td",[t._v("String")]),t._v(" "),a("td",[t._v("'file'")])]),t._v(" "),a("tr",[a("td",[t._v("headers")]),t._v(" "),a("td",[t._v("extra headers to include in the multipart POST, if this value is a function, then it will be called with the file object as parameter and the returned value as headers")]),t._v(" "),a("td",[t._v("Object/Function"),a("sup",[t._v("1.11.0+")])]),t._v(" "),a("td",[t._v("{}")])]),t._v(" "),a("tr",[a("td",[t._v("data")]),t._v(" "),a("td",[t._v("extra data to include in the multipart POST, if this value is a function, then it will be called with the file object as parameter and the returned value as data")]),t._v(" "),a("td",[t._v("Object/Function"),a("sup",[t._v("1.11.0+")])]),t._v(" "),a("td",[t._v("{}")])]),t._v(" "),a("tr",[a("td",[t._v("withCredentials")]),t._v(" "),a("td",[t._v("Standard CORS requests would not send or set any cookies by default. In order to include cookies as part of the request, you need to set the withCredentials property to true")]),t._v(" "),a("td",[t._v("Boolean")]),t._v(" "),a("td",[t._v("false")])]),t._v(" "),a("tr",[a("td",[t._v("timeout")]),t._v(" "),a("td",[t._v("upload request timeout value")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("0")])]),t._v(" "),a("tr",[a("td",[t._v("progressInterval")]),t._v(" "),a("td",[t._v("The time interval between progress reports (Unit: ms)")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("100")])]),t._v(" "),a("tr",[a("td",[t._v("checkSuccess")]),t._v(" "),a("td",[t._v("Check the response should be successful, the parameters is "),a("code",{pre:!0},[t._v("(response, file[, cb])")]),t._v(" object. The "),a("code",{pre:!0},[t._v("file")]),t._v(" and optional "),a("code",{pre:!0},[t._v("cb")]),t._v(" parameters are avaliable after 1.11.0. If there are no "),a("code",{pre:!0},[t._v("cb")]),t._v(" then get this function as result "),a("code",{pre:!0},[t._v("isSuccess")]),t._v(", otherwise the "),a("code",{pre:!0},[t._v("cb(isSuccess)")]),t._v(" parameter "),a("code",{pre:!0},[t._v("isSuccess")]),t._v(" as the result. If the result "),a("code",{pre:!0},[t._v("isSuccess")]),t._v(" is "),a("code",{pre:!0},[t._v("true")]),t._v(" then it will be treated as successful")]),t._v(" "),a("td",[t._v("Function")]),t._v(" "),a("td",[t._v("function (res) { return true }")])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("code",{pre:!0},[t._v("processFile")]),t._v(" sub configuration")])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("p",[t._v("A function with two parameters: "),a("code",{pre:!0},[t._v("(file, next)")]),t._v(", the "),a("code",{pre:!0},[t._v("file")]),t._v(" is the original file and the "),a("code",{pre:!0},[t._v("next")]),t._v(" callback must be called with the processed file.")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("Event Name")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Parameters")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("files-added")]),t._v(" "),a("td",[t._v("triggers when files are added, usually used for file validation")]),t._v(" "),a("td",[t._v("original files")])]),t._v(" "),a("tr",[a("td",[t._v("file-submitted")]),t._v(" "),a("td",[t._v("triggers when a file is added to the "),a("code",{pre:!0},[t._v("upload.files")])]),t._v(" "),a("td",[t._v("the file object")])]),t._v(" "),a("tr",[a("td",[t._v("file-removed")]),t._v(" "),a("td",[t._v("triggers when a file is removed")]),t._v(" "),a("td",[t._v("the file object")])]),t._v(" "),a("tr",[a("td",[t._v("file-success")]),t._v(" "),a("td",[t._v("triggers when a file is uploaded successfully")]),t._v(" "),a("td",[t._v("the file object")])]),t._v(" "),a("tr",[a("td",[t._v("file-error")]),t._v(" "),a("td",[t._v("triggers when a file is failed to upload")]),t._v(" "),a("td",[t._v("the file object")])]),t._v(" "),a("tr",[a("td",[t._v("file-click")]),t._v(" "),a("td",[t._v("triggers when a file is clicked")]),t._v(" "),a("td",[t._v("the file object. After 1.12.39, added file "),a("code",{pre:!0},[t._v("index")]),t._v(" param")])]),t._v(" "),a("tr",[a("td",[t._v("input")]),t._v(" "),a("td",[t._v("triggers when the binding value(file list) changes")]),t._v(" "),a("td",[t._v("the updated value(file list)")])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("Method name")]),t._v(" "),a("th",[t._v("Description")]),t._v(" "),a("th",[t._v("Parameter")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("start")]),t._v(" "),a("td",[t._v("start uploading")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("pause")]),t._v(" "),a("td",[t._v("pause uploading")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("retry")]),t._v(" "),a("td",[t._v("retry uploading")]),t._v(" "),a("td",[t._v("-")])]),t._v(" "),a("tr",[a("td",[t._v("removeFile")]),t._v(" "),a("td",[t._v("remove file")]),t._v(" "),a("td",[t._v("the file object")])])])])}]}},YJZO:function(t,s,a){t.exports=a("aeWw")},aeWw:function(t,s,a){var e=a("VU/8")(null,a("Y8qW"),null,null,null);t.exports=e.exports}});