顯示效果:
代碼:
html:文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-524244.html
<el-tooltip :content="setTip(item)" placement="bottom">
<img :src="setSrc(item)" alt="" width="20" height="20" />
</el-tooltip>
?js:文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-524244.html
setTip(item) {
if (item.fileType === "pdf") {
return "PDF";
} else if (item.fileType === "html") {
return "HTML";
} else if (item.fileType === "docx") {
return "WORD";
} else if (item.fileType === "xlsx") {
return "EXCEL";
} else if (item.fileType === "csv") {
return "CSV";
} else {
return "DEFAULT";
}
},
setSrc(item) {
if (item.fileType === "pdf") {
return require("@/static/images/pdf.png");
} else if (item.fileType === "html") {
return require("@/static/images/html.png");
} else if (item.fileType === "docx") {
return require("@/static/images/word.png");
} else if (item.fileType === "xlsx") {
return require("@/static/images/excel.png");
} else if (item.fileType === "csv") {
return require("@/static/images/csv.png");
} else {
return require("@/static/images/default.png");
}
},
到了這里,關(guān)于vue循環(huán)如何動(dòng)態(tài)加載本地圖片的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!