Alternative for this react code burger ingereidnet add app

user_6613743 0
Viewed 118

Hi Guys I am new in react i am creating one burger builder app for practice i don't undestand the following code, can any one give the simple alternative for this code?

    props.ingredients: {
            salad: 0,
            eggs: 0,
            cheese: 0,
            meat: 0
        },


let ingredientList = Object.keys(props.ingredients)
    .map(igKey => {
        return [...Array(props.ingredients[igKey])].map((_, i) => {
            return <BurgerFilling key={igKey + i} type={igKey} />
        });
    })
    .reduce((rootArray, currEl) => {
        console.log('rootArray>>>', rootArray, currEl);
        return rootArray.concat(currEl);
    }, []);
reactjs javascript-objects arrays javascript
1 Answers

Since props.ingredients is an object and each entry within it is just a number, you can simply map over keys of the object and render it without the need for inner map 

let ingredientList = Object.keys(props.ingredients)
    .map((igKey, i) => {
        return <BurgerFilling key={igKey + i} type={igKey} />
    })
user_59281860
Related