注:用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>

webpack中代理配置(proxyTable)的更多相关文章

  1. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  2. webpack+vue-cli中代理配置(proxyTable)

    在做vue的项目时,用到webpack打包工具,我们会发现本地开发开启的node服务地址请求接口的地址存在跨域问题.本地开启的服务地址是 http://localhost:8080 而服务器的地址是 ...

  3. 说下vue工程中代理配置proxy

    这个代理配置不需要后台进行ngnix代理跳转了,前端可以做.在vue.config.js文件中进行配置,如下: module.exports = { publicPath: process.env.V ...

  4. webpack中babel配置 --- runtime-transform和babel-pollfill

    webpack - babel配置 babel是一个javascript编译器,是前端开发中的一个利器.它突破了浏览器实现es标准的限制,使我们在开发中可以使用最新的javascript语法. 通过构 ...

  5. Webpack中SplitChunksPlugin 配置参数详解

    代码分割本身和 webpack 没有什么关系,但是由于使用 webpack 可以非常轻松地实现代码分割,所以提到代码分割首先就会想到使用 webopack 实现. 在 webpack 中是使用 Spl ...

  6. IDE vscode识别webpack中alias配置路径

    引言网上看到一篇关于 ctrl+鼠标左键无法识别别名路径的问题,最后有人回复的方法只能在ts项目中可以识别 https://segmentfault.com/q/1010000011911879 最后 ...

  7. 小技巧:webpack中@的配置和用法

    好家伙, 当我们要各种两个文件去引用别的文件时,一般这么写 import msg from '../../msg.js' 那么如果文件藏得很深,'../'会变得很多,不美观,也不直观 所以我们又又又可 ...

  8. anaconda 在内网中代理配置

    修改anaconda的配置文件,位置在c:\User(或“用户”)\current_user(当前用户)\.condarc,将以下内容拷贝进去, 替换原有内容, 修改 http://proxy.you ...

  9. webpack中字体配置,可以引入bootstrap

    {test:/\.(eot|ttf|woff|woff2|svg)$/,loader:'file?name=fonts/[name].[ext]'} 将css中用到的字体全部提取存放到fonts目录下 ...

随机推荐

  1. python 使用yaml模块

    python:yaml模块一.yaml文件介绍YAML是一种简洁的非标记语言.其以数据为中心,使用空白,缩进,分行组织数据,从而使得表示更加简洁.1. yaml文件规则基本规则:    大小写敏感   ...

  2. Linux打开关闭ping

    #关闭 ” >/proc/sys/net/ipv4/icmp_echo_ignore_all #打开 ” >/proc/sys/net/ipv4/icmp_echo_ignore_all

  3. SourceInsight 支持 Python

    SourceInsight 支持 Python 步骤一:下载相关的插件 Python.CLF插件 链接如下: Python.CLF|Python.CLF下载_红软基地 http://www.rsdow ...

  4. Leetcode_415字符串相加

    给定两个字符串形式的非负整数 num1 和num2 ,计算它们的和. 注意: ①num1 和num2 的长度都小于 5100.②num1 和num2 都只包含数字 0-9.③num1 和num2 都不 ...

  5. spring boot MVC

    1 spring boot的用途 第一,spring boot可以用来开发mvc web应用. 第二,spring boot可以用来开发rest api. 第三,spring boot也可以用来开发w ...

  6. 关于java使用json不能够使用报没有导包的问题,以及前后台交互json数据的使用

    博客搬迁,给你带来的不便,敬请谅解! http://www.suanliutudousi.com/2017/12/02/%e5%85%b3%e4%ba%8ejava%e4%bd%bf%e7%94%a8 ...

  7. FrameWork内核解析之WindowManagerService(一)中篇

    阿里P7Android高级架构进阶视频免费学习请点击:https://space.bilibili.com/474380680 1.WMS概述 WMS是系统的其他服务,无论对于应用开发还是Framew ...

  8. zabbix--自带模板监控MySQL服务

    zabbix有内置的模板,不过需要修改下配置,配置文件路径在: [root@localhost ~]# cd /etc/zabbix/ [root@localhost zabbix]# ls web ...

  9. Arcpy 遍历每一个要素新建要素类

    #方法一:cursor= arcpy.da.SearchCursor(aim_fc,["OID@","SHAPE@"]) for row in cursor: ...

  10. 关于Oracle中Sort Merge Join的改写

    业务场景的问题,我们有一个刷CUBE的SQL,是Oracle环境,平时跑70多分钟, 但是最近突然不动了,这个SQL需要算累计值,比如年累计客户数量. 累计值是什么意思呢?我们使用下面的数据来说明问题 ...