Skip to content

Commit 4039cdb

Browse files
committed
Add more docs to the README
1 parent d782c96 commit 4039cdb

File tree

4 files changed

+78
-2
lines changed

4 files changed

+78
-2
lines changed

README.md

Lines changed: 67 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,14 +49,80 @@ Vuex ORM is sponsored by awesome folks. Big love to all of them from whole Vuex
4949

5050
## Documentation
5151

52-
Coming soon...
52+
You can check out the full documentation for Vuex ORM Axios at https://vuex-orm.github.io/plugin-axios.
5353

5454
## Questions & Discussions
5555

5656
Join us on our [Slack Channel](https://join.slack.com/t/vuex-orm/shared_invite/enQtNDQ0NjE3NTgyOTY2LTc1YTI2N2FjMGRlNGNmMzBkMGZlMmYxOTgzYzkzZDM2OTQ3OGExZDRkN2FmMGQ1MGJlOWM1NjU0MmRiN2VhYzQ) for any questions and discussions.
5757

5858
Although there is the Slack Channel, do not hesitate to open an [issue](https://github.com/vuex-orm/vuex-orm/issues) for any question you might have. We're always more than happy to hear any feedback, and we don't care what kind of form they are.
5959

60+
## Quick Start
61+
62+
Here's a very simple quick start guide that demonstrates how it feels like to be using Vuex ORM Axios.
63+
64+
### Install and Setup Vuex ORM Axios
65+
66+
Install Vuex ORM Axios by npm or yarn. Note that the Vuex ORM Axios require Axios to be installed manually, so don't forget to install it too!
67+
68+
```bash
69+
$ npm install axios @vuex-orm/core @vuex-orm/plugin-axios
70+
71+
$ yarn add axios @vuex-orm/core @vuex-orm/plugin-axios
72+
```
73+
74+
To plugin Vuex ORM Axios to Vuex ORM, pass Vuex ORM Axios to the `VuexORM.use` method. Here, you should pass your axios instance as an option.
75+
76+
```js
77+
import axios from 'axios'
78+
import VuexORM from '@vuex-orm/core'
79+
import VuexORMAxios from '@vuex-orm/plugin-axios'
80+
81+
VuexORM.use(VuexORMAxios, { axios })
82+
```
83+
84+
### Usage
85+
86+
After setting up Vuex ORM Axios, you may use `Model.api` method to perform api call.
87+
88+
```js
89+
User.api().get('/api/users')
90+
```
91+
92+
Vuex ORM Axios can perform all basic Axios requests, which is `get`, `post`, `put`, `patch`, `delete`, and `request`. These methods take the same arguments as Axios and perform exactly as same as Axios, except it's going to store response data to the store corresponding to the Model that is calling the api.
93+
94+
Vuex ORM Axios lets you define the "Custom Actions" as well. Like this.
95+
96+
```js
97+
class User extends Model {
98+
static entity = 'users'
99+
100+
static fields () {
101+
return {
102+
id: this.attr(null),
103+
name: this.attr('')
104+
}
105+
}
106+
107+
static apiConfig = {
108+
actions: {
109+
fetch: {
110+
method: 'get',
111+
url: '/api/users'
112+
}
113+
}
114+
}
115+
}
116+
```
117+
118+
And then, you can use the above `fetch` method through your model.
119+
120+
```js
121+
User.api().fetch()
122+
```
123+
124+
Now, are you ready to learn more about the plugin? Let's [jump right into it](https://vuex-orm.github.io/plugin-axios).
125+
60126
## Plugins
61127

62128
Vuex ORM can be extended via a plugin to add additional features. Here is the list of available plugins.

docs/.vuepress/config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ module.exports = {
3030
title: 'Vuex ORM Axios',
3131
description: 'Vuex ORM persistence plugin to sync the store against a RESTful API.',
3232

33-
base: '/vuex-orm-axios/',
33+
base: '/plugin-axios/',
3434

3535
themeConfig: {
3636
repo: 'vuex-orm/plugin-axios',

docs/README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,9 +32,14 @@ Vuex ORM is sponsored by awesome folks. Big love to all of them from whole Vuex
3232

3333
- Guide
3434
- [Installation](guide/installation)
35+
- [Setup](guide/setup)
36+
- [Usage](guide/usage)
37+
- [Configurations](guide/configurations)
38+
- [Custom Actions](guide/custom-actions)
3539
- [Sponsors](guide/sponsors)
3640
- API
3741
- [Model](/api/model)
42+
- [Request](/api/request)
3843

3944
## Questions & Discussions
4045

docs/guide/README.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,9 +32,14 @@ Vuex ORM is sponsored by awesome folks. Big love to all of them from whole Vuex
3232

3333
- Guide
3434
- [Installation](guide/installation)
35+
- [Setup](guide/setup)
36+
- [Usage](guide/usage)
37+
- [Configurations](guide/configurations)
38+
- [Custom Actions](guide/custom-actions)
3539
- [Sponsors](guide/sponsors)
3640
- API
3741
- [Model](/api/model)
42+
- [Request](/api/request)
3843

3944
## Questions & Discussions
4045

0 commit comments

Comments
 (0)