docs: upload文档修正

This commit is contained in:
lockingreal 2022-03-28 19:30:19 +08:00
parent 26e5296e7e
commit 30db6aa1ec
2 changed files with 36 additions and 9 deletions

View File

@ -13,19 +13,47 @@
::: demo 使用 `lay-upload` 标签, 创建一个按钮上传单文件 ::: demo 使用 `lay-upload` 标签, 创建一个按钮上传单文件
<template> <template>
  <lay-upload @done="getUploadFile"/> <lay-upload @done="getUploadFile" @choose="beginChoose">
<template #preview>
<div v-for="(item,index) in picList" :key="`demo1-pic-'${index}`">
<img :src="item"/>
</div>
</template>
</lay-upload>
</template> </template>
<script> <script>
import { ref } from 'vue' import { ref,reactive } from 'vue'
export default { export default {
  setup() {   setup() {
const getUploadFile = (file)=>{ const picList = ref([]);
console.log(file); const filetoDataURL=(file,fn)=>{
const reader = new FileReader();
reader.onloadend = function(e){
fn(e.target.result);
};
reader.readAsDataURL(file);
};
const getUploadFile=(files)=>{
if(Array.isArray(files)&&files.length>0){
files.forEach((file,index,array)=>{
filetoDataURL(file,(res)=>{
console.log(res);
picList.value.push(res);
console.log(picList.value);
});
});
}
};
const beginChoose =(e)=>{
console.log("beginChoose",e);
}; };
    return {     return {
getUploadFile getUploadFile,
filetoDataURL,
beginChoose,
picList
    }     }
  }   }
} }
@ -84,7 +112,7 @@ export default {
::: demo 使用 `lay-upload` 标签, 使用 `#preview` 自定义预览的UI交互 ::: demo 使用 `lay-upload` 标签, 使用 `#preview` 自定义预览的UI交互
<template> <template>
  <lay-upload @done="getUploadFile">   <lay-upload @done="getUploadFile2">
<template #preview> <template #preview>
<div class="easy-wrap"> <div class="easy-wrap">
<img src="https://chixian.oss-cn-hangzhou.aliyuncs.com/20211023003617_0706a.jpg" style="width:62.9px;height:63.2px"/> <img src="https://chixian.oss-cn-hangzhou.aliyuncs.com/20211023003617_0706a.jpg" style="width:62.9px;height:63.2px"/>
@ -101,11 +129,11 @@ export default {
import { ref } from 'vue' import { ref } from 'vue'
export default { export default {
  setup() {   setup() {
const getUploadFile = (file)=>{ const getUploadFile2 = (file)=>{
console.log(file); console.log(file);
}; };
    return {     return {
getUploadFile getUploadFile2
    }     }
  }   }
} }

View File

@ -179,7 +179,6 @@ const getUploadChange = (e: any) => {
} }
}; };
const chooseFile = () => { const chooseFile = () => {
console.log(orgFileInput.value);
let _target = orgFileInput.value; let _target = orgFileInput.value;
if (_target) { if (_target) {
_target.click(); _target.click();