上传组件修改

master
toesbieya 6 years ago
parent b640dcdf85
commit 18685d8c38
  1. 3
      vue/src/components/UploadFile/index.vue
  2. 2
      vue/src/config/index.js
  3. 2
      vue/src/utils/file.js
  4. 5
      vue/src/views/example/components/uploadExample.vue

@ -52,7 +52,8 @@
/* /*
* 直传七牛云 * 直传七牛云
* 传入fileList自动拼接七牛云外链前缀并增加downloadUrl属性图片类型的文件url与downloadUrl相同 * 传入fileList自动拼接七牛云外链前缀并增加downloadUrl属性图片类型的文件url与downloadUrl相同
* successremove事件中的file.downloadUrl均不带七牛云外链前缀 * 非图片类型的文件使用kkFileView预览
* successremove事件中的file.url均不带七牛云外链前缀
* */ * */
import axios from 'axios' import axios from 'axios'
import {attachmentPrefix} from '@/config' import {attachmentPrefix} from '@/config'

@ -32,7 +32,7 @@ module.exports = {
attachmentPrefix: 'https://static.toesbieya.cn/', attachmentPrefix: 'https://static.toesbieya.cn/',
//文件预览接口前缀 //文件预览接口前缀
filePreviewPrefix: isDevelopment ? 'http://localhost:8012/file/preview' : 'https://preview.toesbieya.cn', filePreviewPrefix: isDevelopment ? 'http://localhost:8012' : 'https://preview.toesbieya.cn',
//省市地区json数据请求地址 //省市地区json数据请求地址
regionDataUrl: '/static/json/region-pcas.json' regionDataUrl: '/static/json/region-pcas.json'

@ -14,6 +14,8 @@ const defaultOptions = {
//文件预览 //文件预览
export function preview(url) { export function preview(url) {
const connectChar = url.includes('?') ? '&' : '?'
url = url + connectChar + 'fullfilename=' + url.replace(attachmentPrefix, '')
const anchor = document.createElement('a') const anchor = document.createElement('a')
anchor.style.visibility = 'hidden' anchor.style.visibility = 'hidden'
anchor.href = `${filePreviewPrefix}/onlinePreview?url=${encodeURIComponent(url)}` anchor.href = `${filePreviewPrefix}/onlinePreview?url=${encodeURIComponent(url)}`

@ -1,6 +1,9 @@
<template> <template>
<div> <div>
<div class="tip-row">根据业务需求简单封装了upload集成自带预览组件</div> <div class="tip-row">
根据业务需求简单封装了upload集成自带预览组件<br/>
非图片类型的文件使用<a href="https://github.com/kekingcn/kkFileView" target="_blank">kkFileView</a>预览
</div>
<upload-file :file-list="fileList"/> <upload-file :file-list="fileList"/>
<div class="tip-row">原始使用axios的上传</div> <div class="tip-row">原始使用axios的上传</div>
<input @change="change" type="file"> <input @change="change" type="file">

Loading…
Cancel
Save