完成vue-resource的第一步后，接下来看看它的配置。

配置案例

我们以一个配置项目root为例。它是比较有用的，因为我们常常规划api在一个url根下面，就可以使用此配置项简化api访问url。比如我们设计的api形如：

/api/user/api/item

那么不妨设置root为/api，随后的/api/user就可以使用user来访问，/api/item就可以使用item访问。当然换成/user或者/item就不可以了。现在随便创建一个目录，进入此目录，然后来搭建实验环境：

npm init -y   npm i express --save

客户端代码（index.html，放置于public之下）：

    
       {
   {user}}
     
  {
   {item}}
    

服务端代码(index.js,放置于工程的根目录）：

var express = require('express');var app = express();var path = require('path')var public = path.join(__dirname, 'public')app.use('/',express.static(public))app.get('/api/user', function (req, res) {  res.end('hello user');})app.get('/api/item', function (req, res) {  res.end('hello item');})var server = app.listen(8080, function () {  var host = server.address().address  var port = server.address().port  console.log("listening at http://%s:%s", host, port)})

方法$http可以传入一个options对象，在此对象内传递url，method等参数值。这样，在客户端写URL访问就可以使用相对URL，这样用起来多方便的。

这个案例中，使用了 http:{root:'/api'},在Vue实例内完成配置。当然也完全可以做全局配置，比如：

Vue.http.options.root = '/api'

这行代码放在创建Vue实例之前即可。

options对象还可以传递header，data进来的。比如：

var options = {    root:'/api',    headers:{      'Accept-Language':'en-US',      Authorization: 'Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ=='    },    data：{      number:1    }  }

HTTP headers可以很多，具体的条目需要参考HTTP标准。在基本http调用方法$http之上，还可以使用

便利方法

vue-resource提供了如下的便利方法：

get(url,[data],[options])post(url,[data],[options])put(url,[data],[options])delete(url,[data],[options])jsonp(url,[data],[options])

方法get等分别对应HTTP method的GET、POST、PUT、DELETE方法，因此代码：

options = {url:'/api/item',method:'get'}       this.$http(options)

等同于:

this.$http.get('/api/item')

其中的JSONP比较特别，单独介绍。