Skip to content

Commit 04e279e

Browse files
committed
update docs
1 parent 8d764f5 commit 04e279e

File tree

6 files changed

+221
-169
lines changed

6 files changed

+221
-169
lines changed

Diff for: .npmignore

+1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
build
2+
docs
23
bower.json

Diff for: README.md

+4-169
Original file line numberDiff line numberDiff line change
@@ -16,173 +16,8 @@ var Vue = require('vue');
1616
Vue.use(require('vue-resource'));
1717
```
1818

19-
### Configuration
19+
## Documentation
2020

21-
Set default values using the global configuration.
22-
23-
```js
24-
Vue.http.options.root = '/root';
25-
Vue.http.headers.common['Authorization'] = 'Basic YXBpOnBhc3N3b3Jk';
26-
```
27-
28-
Set default values inside your Vue component options.
29-
30-
```js
31-
new Vue({
32-
33-
http: {
34-
root: '/root',
35-
headers: {
36-
Authorization: 'Basic YXBpOnBhc3N3b3Jk'
37-
}
38-
}
39-
40-
})
41-
```
42-
43-
## HTTP
44-
45-
The http service can be used globally `Vue.http` or in a Vue instance `this.$http`.
46-
47-
### Methods
48-
49-
* `get(url, [data], [options])`
50-
* `post(url, [data], [options])`
51-
* `put(url, [data], [options])`
52-
* `patch(url, [data], [options])`
53-
* `delete(url, [data], [options])`
54-
* `jsonp(url, [data], [options])`
55-
56-
### Options
57-
58-
* **url** - `string` - URL to which the request is sent
59-
* **method** - `string` - HTTP method (e.g. GET, POST, ...)
60-
* **data** - `Object|string` - Data to be sent as the request message data
61-
* **params** - `Object` - Parameters object to be appended as GET parameters
62-
* **headers** - `Object` - Headers object to be sent as HTTP request headers
63-
* **beforeSend** - `function(request)` - Callback function to modify the request object before it is sent
64-
* **emulateHTTP** - `boolean` - Send PUT, PATCH and DELETE requests with a HTTP POST and set the `X-HTTP-Method-Override` header
65-
* **emulateJSON** - `boolean` - Send request data as `application/x-www-form-urlencoded` content type
66-
* **xhr** - `Object` - Parameters object to be set on the native XHR object
67-
* **jsonp** - `string` - Callback function name in a JSONP request
68-
* **timeout** - `number` - Request timeout in milliseconds (`0` means no timeout)
69-
70-
71-
### Example
72-
73-
```js
74-
new Vue({
75-
76-
ready: function() {
77-
78-
// GET request
79-
this.$http.get('/someUrl').then(function (response) {
80-
81-
// get status
82-
response.status;
83-
84-
// get all headers
85-
response.headers();
86-
87-
// get 'expires' header
88-
response.headers('expires');
89-
90-
// set data on vm
91-
this.$set('someData', response.data)
92-
93-
}, function (response) {
94-
95-
// handle error
96-
});
97-
98-
}
99-
100-
})
101-
```
102-
103-
## Resource
104-
105-
The resource service can be used globally `Vue.resource` or in a Vue instance `this.$resource`.
106-
107-
### Methods
108-
109-
* `resource(url, [params], [actions], [options])`
110-
111-
### Default Actions
112-
113-
```js
114-
get: {method: 'GET'},
115-
save: {method: 'POST'},
116-
query: {method: 'GET'},
117-
update: {method: 'PUT'},
118-
remove: {method: 'DELETE'},
119-
delete: {method: 'DELETE'}
120-
```
121-
122-
### Example
123-
```js
124-
new Vue({
125-
126-
ready: function() {
127-
128-
var resource = this.$resource('someItem{/id}');
129-
130-
// get item
131-
resource.get({id: 1}).then(function (response) {
132-
this.$set('item', response.item)
133-
});
134-
135-
// save item
136-
resource.save({id: 1}, {item: this.item}).then(function (response) {
137-
// handle success
138-
}, function (response) {
139-
// handle error
140-
});
141-
142-
// delete item
143-
resource.delete({id: 1}).then(function (response) {
144-
// handle success
145-
}, function (response) {
146-
// handle error
147-
});
148-
149-
}
150-
151-
})
152-
```
153-
154-
## Interceptors
155-
156-
Interceptors can be defined globally and are used for pre- and postprocessing of a request.
157-
158-
```js
159-
Vue.http.interceptors.push({
160-
161-
request: function (request) {
162-
return request;
163-
},
164-
165-
response: function (response) {
166-
return response;
167-
}
168-
169-
});
170-
```
171-
172-
A factory function can also be used.
173-
174-
```js
175-
Vue.http.interceptors.push(function () {
176-
return {
177-
178-
request: function (request) {
179-
return request;
180-
},
181-
182-
response: function (response) {
183-
return response;
184-
}
185-
186-
};
187-
});
188-
```
21+
- [Configuration](docs/config.md)
22+
- [HTTP Requests/Response](docs/http.md)
23+
- [Creating Resources](docs/resource.md)

Diff for: bower.json

+1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
"ignore": [
99
".*",
1010
"build",
11+
"docs",
1112
"package.json"
1213
]
1314
}

Diff for: docs/config.md

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# Configuration
2+
3+
Set default values using the global configuration.
4+
5+
```js
6+
Vue.http.options.root = '/root';
7+
Vue.http.headers.common['Authorization'] = 'Basic YXBpOnBhc3N3b3Jk';
8+
```
9+
10+
Set default values inside your Vue component options.
11+
12+
```js
13+
new Vue({
14+
15+
http: {
16+
root: '/root',
17+
headers: {
18+
Authorization: 'Basic YXBpOnBhc3N3b3Jk'
19+
}
20+
}
21+
22+
})
23+
```

Diff for: docs/http.md

+141
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,141 @@
1+
# HTTP
2+
3+
The http service can be used globally `Vue.http` or in a Vue instance `this.$http`.
4+
5+
## Usage
6+
7+
A Vue instance provides the `this.$http(options)` function which takes an options object for generating an HTTP request and returns a promise. Also the Vue instance will be automatically bound to `this` in all function callbacks.
8+
9+
```js
10+
new Vue({
11+
12+
ready: function() {
13+
14+
// GET request
15+
this.$http({url: '/someUrl', method: 'GET'}).then(function (response) {
16+
// success callback
17+
}, function (response) {
18+
// error callback
19+
});
20+
21+
}
22+
23+
})
24+
```
25+
26+
The response object properties:
27+
28+
Property | Type | Description
29+
------------ | -------------
30+
data | `Object`, `string` | Response body data
31+
ok | `boolean` | HTTP status code between 200 and 299
32+
status | `number` | HTTP status code of the response
33+
statusText | `string` | HTTP status text of the response
34+
headers | `function([name])` | HTTP header getter function
35+
request | `Object` | Request options object
36+
37+
## Methods
38+
39+
Shortcut methods are available for all request types. These methods work globally or in a Vue instance.
40+
41+
```js
42+
// global Vue object
43+
Vue.http.get('/someUrl', [data], [options]).then(successCallback, errorCallback);
44+
Vue.http.post('/someUrl', [data], [options]).then(successCallback, errorCallback);
45+
46+
// in a Vue instance
47+
this.$http.get('/someUrl', [data], [options]).then(successCallback, errorCallback);
48+
this.$http.post('/someUrl', [data], [options]).then(successCallback, errorCallback);
49+
```
50+
List of shortcut methods:
51+
52+
* `get(url, [data], [options])`
53+
* `post(url, [data], [options])`
54+
* `put(url, [data], [options])`
55+
* `patch(url, [data], [options])`
56+
* `delete(url, [data], [options])`
57+
* `jsonp(url, [data], [options])`
58+
59+
## Options
60+
61+
Parameter | Type | Description
62+
------------ | -------------
63+
url | `string` | URL to which the request is sent
64+
method | `string` | HTTP method (e.g. GET, POST, ...)
65+
data | `Object`, `string` | Data to be sent as the request message data
66+
params | `Object` | Parameters object to be appended as GET parameters
67+
headers | `Object` | Headers object to be sent as HTTP request headers
68+
beforeSend | `function(request)` | Callback function to modify the request object before it is sent
69+
emulateHTTP | `boolean` | Send PUT, PATCH and DELETE requests with a HTTP POST and set the `X-HTTP-Method-Override` header
70+
emulateJSON | `boolean` | Send request data as `application/x-www-form-urlencoded` content type
71+
xhr | `Object` | Parameters object to be set on the native XHR object
72+
jsonp | `string` | Callback function name in a JSONP request
73+
timeout | `number` | Request timeout in milliseconds (`0` means no timeout)
74+
75+
## Example
76+
77+
```js
78+
new Vue({
79+
80+
ready: function() {
81+
82+
// GET request
83+
this.$http.get('/someUrl').then(function (response) {
84+
85+
// get status
86+
response.status;
87+
88+
// get all headers
89+
response.headers();
90+
91+
// get 'expires' header
92+
response.headers('expires');
93+
94+
// set data on vm
95+
this.$set('someData', response.data)
96+
97+
}, function (response) {
98+
99+
// error callback
100+
});
101+
102+
}
103+
104+
})
105+
```
106+
107+
## Interceptors
108+
109+
Interceptors can be defined globally and are used for pre- and postprocessing of a request.
110+
111+
```js
112+
Vue.http.interceptors.push({
113+
114+
request: function (request) {
115+
return request;
116+
},
117+
118+
response: function (response) {
119+
return response;
120+
}
121+
122+
});
123+
```
124+
125+
A factory function can also be used.
126+
127+
```js
128+
Vue.http.interceptors.push(function () {
129+
return {
130+
131+
request: function (request) {
132+
return request;
133+
},
134+
135+
response: function (response) {
136+
return response;
137+
}
138+
139+
};
140+
});
141+
```

0 commit comments

Comments
 (0)