Как сопоставить группу объектов в js другому объекту

Question

У меня есть объект, и мне нужно вернуть каждый из них, чтобы проверить результат его отображения. Моя проблема с моим кодом ниже в этой строке

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

Мне нужен способ пройти через все настройки и передать их на карту. Не знаете, как сделать это наиболее эффективным способом в ES6?

Это значение параметров, переданных в компонент PassThrough

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

Вот мой компонент

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/>
  );
};

Answer 1

Вероятно, самое короткое:

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

Но на самом деле я бы изменил settings на:

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

Тогда это просто:

inlineStlye: settings(map)