关于ImagePreview组件,新增一个判断是否为外部链接的utill方法,简单粗暴,干净又卫生啊兄弟们,另外加了一个判断如果地址为空则使用若依logo进行显示

This commit is contained in:
XCSDN
2022-04-17 13:38:32 +00:00
committed by Gitee
parent b42a8176ca
commit 429f63cfb7
2 changed files with 23 additions and 3 deletions

View File

@ -12,7 +12,8 @@
</template> </template>
<script> <script>
import { isExternal } from "@/utils/validate"; import { isExternalNew } from "@/utils/validate";
import logoImg from '@/assets/logo/logo.png'
export default { export default {
name: "ImagePreview", name: "ImagePreview",
@ -33,18 +34,26 @@ export default {
computed: { computed: {
realSrc() { realSrc() {
let real_src = this.src.split(",")[0]; let real_src = this.src.split(",")[0];
if (isExternal(real_src)) { if (isExternalNew(real_src)) {
return real_src; return real_src;
} }
//判断如果地址为空则使用若依logo进行显示
if(real_src===""){
return logoImg;
}
return process.env.VUE_APP_BASE_API + real_src; return process.env.VUE_APP_BASE_API + real_src;
}, },
realSrcList() { realSrcList() {
let real_src_list = this.src.split(","); let real_src_list = this.src.split(",");
let srcList = []; let srcList = [];
real_src_list.forEach(item => { real_src_list.forEach(item => {
if (isExternal(item)) { if (isExternalNew(item)) {
return srcList.push(item); return srcList.push(item);
} }
//判断如果地址为空则使用若依logo进行显示
if(item===""){
return srcList.push(logoImg);
}
return srcList.push(process.env.VUE_APP_BASE_API + item); return srcList.push(process.env.VUE_APP_BASE_API + item);
}); });
return srcList; return srcList;

View File

@ -1,4 +1,5 @@
/** /**
* 判断是否为外部链接
* @param {string} path * @param {string} path
* @returns {Boolean} * @returns {Boolean}
*/ */
@ -6,6 +7,16 @@ export function isExternal(path) {
return /^(https?:|mailto:|tel:)/.test(path) return /^(https?:|mailto:|tel:)/.test(path)
} }
/**
* 判断是否为外部链接
* 例如http://xxxx https://xxxx chrome:// tcp:// ....等都会返回true
* @param {string} path
* @returns {Boolean}
*/
export function isExternalNew(path) {
return path.indexOf("://") !== -1
}
/** /**
* @param {string} str * @param {string} str
* @returns {Boolean} * @returns {Boolean}