0.6.2 • Published 3 years ago
addtocart-mini-app v0.6.2
ADD TO CART Mini-app
Changelogs
- v0.6.2 - Patch Release (Cart sort)
- v0.5.2 - New feature (mobile responsive)
- v0.4.2 - Patch Release (state not updated)
- v0.4.1 - Add readme image
- v0.3.1 - Empty cart added
- v0.2.1 - Adding props
- v0.1.1 - Adding redux
- v0.0.1 - Adding cart and card componentsInstallation
npm i addtocart-mini-appreact 18 higher
npm i addtocart-mini-app --legacy-peer-depsUsage
import {Cart } from "addtocart-mini-app"
const dataLoad = {
data:[
{
id: 1,
title: "Product 1",
description: "Best headphone",
price: 120.00,
quantity: 3,
dateAdded: "Fri Oct 28 2022 12:33:52 GMT+0800 (Philippine Standard Time)",
image: "https://i.pinimg.com/originals/0d/86/b1/0d86b14bb6503907498ebff62062ae12.png"
},
{
id: 2,
dateAdded: "Fri Oct 28 2022 12:33:01 GMT+0800 (Philippine Standard Time)",
title: "Product 2",
description: "Best headphone 2",
price: 100.00,
quantity: 1,
image: "https://www.nicepng.com/png/detail/151-1512944_red-headphone-png-image-background-beats-by-dr.png"
}
]
}
const dataIn = {
action:{
shoplink: () => alert("go to shop"),
decreaseQty: (i:any) => alert(`decrease quantity of item with the id of ${i}` ),
increaseQty: (i:any) => alert(`increase quantity of item with the id of ${i}` ),
removeItems: (i:any) => alert(`remove this item with the id of ${i}`)
}
}
function App() {
return (
<div className="">
<Cart dataLoad={dataLoad} dataIn={dataIn} data={(i) => console.log(i)}/>
</div>
);
}
export default App;Props
| Props | Types | Default Value | Required | Description |
|---|---|---|---|---|
| dataOut | Function | None | True | Dataout will handle the next action after clicking checkout |
| dataIn | Object | None | True | Object with action object that will handle shoplink, decreaseQty, increaseQty, removeItems |
| shoplink | Function | None | True | This will handle to go back to shop |
| decreaseQty | Function | None | True | This will handle the minus button in a cart, use this to update the quantity of the item in state |
| increaseQty | Function | None | True | This will handle the plus button in a cart, use this to update the quantity of the item in state |
| removeItems | Function | None | True | This will handle the remove item in a cart, use this to to remove item from a cart using redux |
| dataLoad | Array of object | None | True | Initial data of a cart |
Node Version
v16.15.0Peer Dependecies
"react": "^17.0.2",
"react-dom": "^17.0.2"