How to map a bunch of objects in js to another object

Question

I have an object and I need to return each one to check for its mapping result. My problem with my code below is on this line

style: { ...map[settings] },

I need a way to go through each setting and pass it to map. Not sure how to go about that the most efficient way in es6 ?

This is the value of settings been passed into the PassThrough component

const settings = {
  block_background: GradientGreen,
  block_spacing: padding,
};

Here is my Component

const PassThrough = ({ children, settings }) => {
  const map = {
    GradientGreen: {
      background: 'linear-gradient(-95deg, green, blue 100%)',
    },
    padding: '20px',
  };

  const cloneChild = () => {
    return cloneElement(children, {
      style: { ...map[settings] },
    });
  };

  return (
    <Fragment>
      {cloneChild()}
    <Fragment/>
  );
};

Jonas Wilms · Accepted Answer · 2019-01-25 07:06:55Z

2

The shortest is probably:

 inlineStyle: Object.assign({}, ...Object.entries(settings).map(([k, v]) => ({ [k]: map[v] })))

But actually I would change settings to:

const settings = original => {
 block_background: original.GradientGreen,
 block_spacing: original.padding,
};

Then it is just:

inlineStlye: settings(map)

edited Jan 25, 2019 at 7:06

answered Jan 24, 2019 at 21:16

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

me-me Over a year ago

I can't change settings its coming from a server. This seems to be returning the incorrect values. Seems to be returning the settings object and not the map values

Jonas Wilms Over a year ago

@me-me what output do you expect?

me-me Over a year ago

You're code is right it was mine that was off. Thank you for this its exactly what I'm after

me-me Over a year ago

I changed your code a little to work with what I'm after. But the issue is the values are coming back as an object with keys associated to them. I'm looking to combine both into one. I feel like I'm better off starting another thread based on the new code.

Jonas Wilms Over a year ago

@me-me whoops, fixed that

|

Collectives™ on Stack Overflow

How to map a bunch of objects in js to another object

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related