使用vue-element-admin框架調(diào)用后端接口及跨域的問題
更新時間：2023年11月27日 09:24:41 作者：小僵尸打字員
這篇文章主要介紹了使用vue-element-admin框架調(diào)用后端接口及跨域的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
前言
vue-element-admin 官方git地址 https://github.com/PanJiaChen/vue-element-admin
進行開發(fā)需要調(diào)用外部接口, 而且還涉及到跨域的問題，百度出來的全部都是說在config目錄加proxyTable…emmm是拉同一個項目嗎大兄弟, 哪來的config目錄
解決
隨便寫一個測試接口
from flask import Flask, url_for
import json
app = Flask(__name__)
@app.route("/xiaofei")
def test():
return json.dumps({"name": "小飛"})
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0')
在 src/api里面新啟一個文件, 然后定義一個接口
在前端隨便寫個按鈕加上點擊事件
項目的config是最外層的vue.config.js, 在里面找到proxy在下面加入自己的配置解可以了
key是一個匹配器, 我的規(guī)則xiaofei開頭的用的自定義的target, 可以加多層規(guī)則, 也可以看一下官方的配置文檔
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了詳解vuex之store源碼簡單解析，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
在運行Vue項目時遇到npm安裝錯誤可使用命令npminstall--legacy-peer-deps解決,若VsCode中無法運行npm命令,則可能是IDE配置未生效,可嘗試重啟電腦或使用cmd命令行直接在項目目錄下運行2024-10-10
Vue3+vite路由配置優(yōu)化(自動化導(dǎo)入)
這篇文章主要介紹了Vue3+vite路由配置優(yōu)化(自動化導(dǎo)入),需要的朋友可以參考下2023-09-09
vue3 template轉(zhuǎn)為render函數(shù)過程詳解
在 Vue 中,template 模板是我們編寫組件的主要方式之一,而 Vue 內(nèi)部會將這些模板轉(zhuǎn)換為 render 函數(shù),render 函數(shù)是用于創(chuàng)建虛擬 DOM 的函數(shù),通過它,Vue 能夠高效地追蹤 DOM 的變化并進行更新,下面我會通俗易懂地詳細解釋 Vue 如何將 template 轉(zhuǎn)換為 render 函數(shù)2024-10-10
這篇文章主要為大家詳細介紹了vue遞歸實現(xiàn)自定義tree組件，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
Vite?Vue3?EsLint?Prettier配置步驟極簡方法詳解
這篇文章主要為大家介紹了Vite?Vue3?EsLint?Prettier配置步驟的極簡方法詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-09-09
vue使用element實現(xiàn)上傳圖片和修改圖片功能
前幾天做到一個關(guān)于圖片上傳功能,下面這篇文章主要給大家介紹了關(guān)于vue使用element實現(xiàn)上傳圖片和修改圖片功能的相關(guān)資料,文中通過示例代碼介紹的非常詳細,需要的朋友可以參考下2022-07-07
Vue項目中引入translate.js實現(xiàn)國際化自動翻譯功能實例
translate.js幫你一行代碼搞定翻譯,支持Google、DeepL、LibreTranslate等多個主流翻譯引擎,Node.js和瀏覽器通用,這篇文章主要介紹了Vue項目中引入translate.js實現(xiàn)國際化自動翻譯功能的相關(guān)資料,需要的朋友可以參考下2025-07-07
這篇文章主要介紹了vue移動UI框架滑動加載的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
vue3如何添加eslint校驗(eslint-plugin-vue)
這篇文章主要介紹了vue3如何添加eslint校驗(eslint-plugin-vue),具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-01-01