注:用axios請求
1,下載axios
npm i axios --save
2,在config文件下的index.js中配置代理地址
參考:https://vuejs-templates.github.io/webpack/proxy.html
舉例:localhost:8080/api/xxx 代理到 http://192.168.10.183:8103/api/xxx,如果用pathRewrite重寫則代理到http://192.168.10.183:8103/xxx
將'/api'轉為'/'
proxyTable: { '/api': {// '/api':匹配項 target: 'http://192.168.10.183:8103',// 接口的域名
// secure: false,// 如果是https接口,需要配置這個參數 changeOrigin: true,// 如果接口跨域,需要進行這個參數配置
// pathRewrite: {// 如果接口本身沒有/api需要通過pathRewrite來重寫了地址
// '^api': ''
// }
} }
3.用axios請求資源
參考:https://www.npmjs.com/package/axios
// 引入axios
import axios from 'axios' export function getProductTree() {
// 用axios.get()請求資源 return axios.get('/api/pageblock/getProductCategoryTree') }
4.頁面中請求資源
<script> import { getProductTree } from 'api/product-tree.js' export default { created() { this._getProductTree() }, methods: { _getProductTree() { // 頁面加載時請求資源 getProductTree().then(data => { console.log(data) }) } } } </script>