axios获取数据的两种方法

最新推荐文章于 2025-05-18 12:34:13 发布

原创最新推荐文章于 2025-05-18 12:34:13 发布 · 8.7k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#axios

前端专栏专栏收录该内容

31 篇文章

订阅专栏

本文介绍了使用axios库获取数据的两种方法。在旧版本中，可以在组件内添加特定代码；而在新方法中，直接在组件内敲入不同的代码段来实现数据获取。这两种方式都是axios常用的数据请求方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

第一种方法
在build/dev-server.js里面添加下面的代码 [旧版本]

var app = express();
var goodsData = require('../mock/goods.json');
var router = express.Router();
router.get("/good", function(req,res){
  res.json(goodsData);
});
app.use(router);

在组件里面使用以下代码

axios.get('/good').then({ data } => {    //返回时一个promise对象，调用then方法获得数据
	this.goodsList = data.result;   //将获取的数据存储到goodsList里面去
})

第二种方法
在webpack.config.js里面敲入如下代码

devServer: {
   proxy: {
     '/api' : {  // 带有/api开头的信息都会被代理到http://127.0.0.1:8080
      target: 'http://127.0.0.1:8080',
      pathRewrite : { 
        '^/api' : '/static/mock' // 路径改写
      }
    }
   }
 }