Vue批量圖片顯示時(shí)遇到的路徑被解析問(wèn)題
最近在學(xué)Vue，感覺(jué)很難理解，學(xué)不懂。
昨天晚上開(kāi)始第一個(gè)頁(yè)面的搭建，腦子感覺(jué)通了一點(diǎn)，大概知道該怎么做了。
在放置輪播圖時(shí)，要調(diào)用很多圖片，圖片路徑在data的一個(gè)數(shù)組里，用v-for循環(huán)（因?yàn)檫€不會(huì)做輪播圖，從網(wǎng)上找的代碼）
圖片路徑是對(duì)的，但是不顯示，就用普通img標(biāo)簽放了個(gè)圖片看了一下，這樣
網(wǎng)頁(yè)上卻變成了這樣
于是我把每個(gè)圖片都放了一次，把每個(gè)解析后的地址都粘貼在數(shù)組里，成了
但是這種方法也太蠢了，以后不能也這樣辦吧
就在網(wǎng)上查了一下，要加一個(gè)require，很多帖子里的圖片路徑都加了個(gè)require，那就試試
成功！ 但是不知道是什么原理，大概是把路徑的字符串封裝起來(lái)了？
然后又去查了查require是干啥的，感覺(jué)用過(guò) ，但不知道哪里用過(guò)
使用位置
require是運(yùn)行時(shí)調(diào)用，所以require理論上可以運(yùn)用在代碼的任何地方
require本質(zhì)
require是賦值過(guò)程，其實(shí)require的結(jié)果就是對(duì)象、數(shù)字、字符串、函數(shù)等，再把require的結(jié)果賦值給某個(gè)變量
這樣的話就把路徑字符串變成變量了
以上所述是小編給大家介紹的Vue批量圖片顯示時(shí)遇到的路徑被解析問(wèn)題詳解整合，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
在本文中我們給大家整理了一篇關(guān)于Vue表單控件綁定的相關(guān)知識(shí)點(diǎn)內(nèi)容，有需要的朋友們參考下。2019-02-02
vue3?使用defineAsyncComponent與component標(biāo)簽實(shí)現(xiàn)動(dòng)態(tài)渲染組件思路詳解
這篇文章主要介紹了vue3?使用defineAsyncComponent與component標(biāo)簽實(shí)現(xiàn)動(dòng)態(tài)渲染組件,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-03-03
在vue中當(dāng)我們管理數(shù)據(jù)的時(shí)候比較亂，我們要用到下面的這個(gè)庫(kù)，本文主要介紹了如何使用 Vuex的入門(mén)教程，具有一定的參考價(jià)值，感興趣的可以了解一下2022-02-02
這篇文章主要介紹了使用vxe-table合并單元格后增加選中效果，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09
Vue組件傳值方式(props屬性,父到子,子到父,兄弟傳值)
這篇文章主要介紹了Vue組件傳值方式(props屬性,父到子,子到父,兄弟傳值),具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-06-06
vuejs實(shí)現(xiàn)遞歸樹(shù)型菜單組件
本篇文章主要介紹了vuejs實(shí)現(xiàn)遞歸樹(shù)型菜單組件，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-01-01
最近一直在做的項(xiàng)目是Vue2搭建的項(xiàng)目，本文主要介紹了Vue全局自定義指令Modal拖拽的實(shí)踐，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
Vue.js報(bào)錯(cuò)Failed to resolve filter問(wèn)題的解決方法
這篇文章主要介紹了Vue.js報(bào)錯(cuò)Failed to resolve filter問(wèn)題的解決方法,需要的朋友可以參考下2016-05-05
vue 解決報(bào)錯(cuò)問(wèn)題小結(jié)
最近入門(mén)vue,用字節(jié)跳動(dòng)的arco初始化一個(gè)項(xiàng)目的時(shí)候報(bào)錯(cuò)自己解決后沒(méi)來(lái)的及截圖,從別人那拷貝個(gè)網(wǎng)圖把,是一樣的報(bào)錯(cuò),本文給大家分享vue 解決報(bào)錯(cuò)問(wèn)題小結(jié),感興趣的朋友一起看看吧2023-09-09
keepalive是Vue的內(nèi)置組件,作用是將組件緩存在內(nèi)存當(dāng)中,防止重復(fù)渲染DOM,屬于消耗內(nèi)存獲取速度,這篇文章主要介紹了vue3項(xiàng)目keepAlive使用方法,主要將keepaliev在vue3.0中的用法,需要的朋友可以參考下2024-03-03