Vue加載讀取本地txt/json等文件的實現(xiàn)方式
更新時間：2023年10月11日 15:13:34 作者：1024小神
這篇文章主要介紹了Vue加載讀取本地txt/json等文件的實現(xiàn)方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
Vue加載讀取本地txt/json等文件
首先
本地的txt/json文件的位置一定要放在public文件夾下：
不然讀取不到
在utils文件夾下創(chuàng)建一個方法
const loadFile = function (name) {
// name為文件所在位置
let xhr = new XMLHttpRequest()
const okStatus = document.location.protocol === 'file:' ? 0 : 200
xhr.open('GET', name, false)
xhr.overrideMimeType('text/html;charset=utf-8') //默認為utf-8
xhr.send(null)
return xhr.status === okStatus ? xhr.responseText : null
}
export default loadFile位置
或者放在vue的methods下也可以
然后在vue中引入
注意文件路徑
是./開頭的
總結
以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
這篇文章主要為大家介紹了vue3響應式Object代理對象的讀取示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08
這篇文章主要介紹了Vue綁定用戶接口代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-11-11
解決element-ui中下拉菜單子選項click事件不觸發(fā)的問題
今天小編就為大家分享一篇解決element-ui中下拉菜單子選項click事件不觸發(fā)的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
vue+導航錨點聯(lián)動-滾動監(jiān)聽和點擊平滑滾動跳轉實例
今天小編就為大家分享一篇vue+導航錨點聯(lián)動-滾動監(jiān)聽和點擊平滑滾動跳轉實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
今天小編就為大家分享一篇Vue實現(xiàn)用戶自定義字段顯示數據的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
vue報錯"vue-cli-service‘不是內部或外部命令,也不是...”的解決辦法
這篇文章主要介紹了vue報錯"vue-cli-service‘不是內部或外部命令，也不是...”的解決辦法,本文給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-01-01
文章介紹了使用vue-pdf@4.3.0時遇到的上傳特殊PDF文件無法正常預覽的問題,通過查看控制臺報錯信息,發(fā)現(xiàn)是因為缺少字體導致的,解決方法是修改pdfjs-dist庫的代碼,注釋掉隱藏電子簽章的代碼,為了在生產環(huán)境中應用這個修改,使用了patch-package插件,感興趣的朋友一起看看吧2024-11-11
這篇文章主要介紹了Vue中跨域以及打包部署到nginx跨域設置方法，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下2019-08-08
這篇文章主要為大家詳細介紹了vue大屏展示適配，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
這篇文章主要介紹了vue使用directive限制表單輸入整數，小數,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-04-04