currexer
v1.1.0
Published
A lightweight currency rates exchanger
Downloads
16
Readme
currexer
A lightweight currency rates exchanger Check live demo!
Install
npm install --save currexer
Usage
All you need is to pass an object of currencies with the needed props, and a callback function to update your state on exchange.
import React, { Component } from 'react'
import Currexer from 'currexer'
function Example {
const initData = [
{
balance: 631,
code: 'USD',
title: 'US Dollar',
symbole: '$',
avatar: 'https://www.merchantstronghold.com/currency/wp-content/uploads/2017/05/usd-1.png'
},
{
balance: 2671,
code: 'GBP',
title: 'British Pound',
symbole: '£',
avatar: 'https://upload.wikimedia.org/wikipedia/en/thumb/a/ae/Flag_of_the_United_Kingdom.svg/800px-Flag_of_the_United_Kingdom.svg.png'
},
{
balance: 120,
code: 'EUR',
title: 'Euro',
symbole: '€',
avatar: 'https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcTy4DgxR-K_UnfC9u5m6DVo8ZnutukKbpETkw&usqp=CAU'
},
{
balance: 2220,
code: 'PLN',
title: 'Polish Zloty',
symbole: 'zł',
avatar: 'https://cdn.britannica.com/52/3552-004-D849A1D3/Flag-Poland.jpg'
},
]
const [currencies, setCurrencies] = useState(initData)
const handleChange = (updatedBalances) => {
const updatedCurrencies = [ ...currencies ]
Object.entries(updatedBalances).forEach(([code, balance]) => {
updatedCurrencies[code] && (updatedCurrencies[code].balance = balance)
})
setCurrencies(updatedCurrencies)
}
return (
<CurrExer
currencies={currencies}
onExchange={handleChange}
/>
)
}
License
(MIT) © AbdallahZac