This repository was archived by the owner on Apr 19, 2022. It is now read-only.
- Notifications
You must be signed in to change notification settings - Fork0
The simple but powerful vue component for the fixer API
License
NotificationsYou must be signed in to change notification settings
eperedo/vue-fixer
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
The simple but powerful vue component for the fixer API
- Latest rates endpoint
- Convert endpoint
- Historical rates endpoint
- Time-Series data endpoint
- Fluctuation data endpoint
First at all make sure you have a fixer API KEY. If you don't, please grab onefrom here.
npm i vue-fixer -S
Or using unpkg
<scriptsrc="https://unpkg.com/vue-fixer/dist/vueFixer.umd.min.js"></script>
importvueFixerfrom'vue-fixer';exportdefault{name:'my-component',components:{vueFixer,// vueFixer: window.vueFixer, if you are using the UMD version},};
And now in your template
<vue-fixerapi-key="my_fixer_secret_key"/>
The vue-fixer component emit aninput event giving you all the data you want.
<vue-fixerapi-key="my_fixer_secret_key"@input="myMethod"/><pre>{{fixerData}}</pre>
importvueFixerfrom'vue-fixer';functiondata(){return{fixerData:{},};}functionmyMethod(fixerData){this.fixerData=fixerData;}exportdefault{name:'my-component',components:{vueFixer,},data,methods:{myMethod,},};
Prop | Default | Type | Description |
---|---|---|---|
api-key | none | String | The fixer api key |
feature | latest | String | the fixer feature you want to fetch |
params | &base=EUR&symbols=USD,PEN | String | query parameters |
protocol | http | String | The http protocol you want to use |
fetching | true | Boolean | Flag who determine if the request to fixer must be done right away |
Name | Default | Value | Description |
---|---|---|---|
input | none | Object | The fixer http response |
error | none | Object | the fixer http response error |
Instead using events you can use slots and get the same result
<fixer:api-key="model.key"><divslot-scope="props"><divv-show="props.fixer.success"><header><h2>Today 1 {{ props.fixer.base }} worth</h2></header><section><ulv-for="(rate, label) in props.fixer.rates":key="rate"><li>In {{label}} = {{ rate }}</li></ul></section></div></div></fixer>
About
The simple but powerful vue component for the fixer API
Topics
Resources
License
Code of conduct
Stars
Watchers
Forks
Packages0
No packages published