You can also refer to a React component using dot-notation from within JSX. This is convenient if you have a single module that exports many React components. For example, if MyComponents.DatePicker is a component, you can use it directly from JSX with:
import React from 'react'; const MyComponents = { DatePicker: function DatePicker(props) { return <div>Imagine a {props.color} datepicker here.</div>; } } function BlueDatePicker() { return <MyComponents.DatePicker color="blue" />; }
Интересует мнениеСобирать мнения и проводить опросы тут нельзя. Правила. Лучше задавать вопрос, на который можно дать однозначный проверяемый воспроизводимый ответ.
.modal-wrapper {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
/* То, что нужно */
overscroll-behavior: contain;
}
Как правильнее было бы реализовать это?
const keys = new Set(
Object.values(data)
.map((entry) => Object.keys(entry))
.flat()
);
const properties = Object.keys(data).map((key) => [
key.split("_").shift(),
key,
]);
const result = [...keys].reduce((acc, key) => {
acc[key] = Object.fromEntries(
properties.map(([property, type]) => [property, data[type][key] ?? 0])
);
return acc;
}, {});
const mappedData = Object.entries(data).reduce((acc, [type, entry]) => {
const property = type.split('_').shift();
for (const key in entry) {
acc[key] = { ...acc[key], [property]: entry[key] };
}
return acc;
}, {});
console.log(mappedData);
/*
{
"Машины и оборудование прочие, не включенные в другие группировки": {
"active": 1,
"inactive": 2
},
"Насосное оборудование, комлектующие, сопутствующие": {
"active": 1,
"inactive": 2
},
"Электродвигатели, генераторы и трансформаторы силовые": {
"active": 1,
"inactive": 2
},
"Средства транспортные прочие, не включенные в другие группировки": {
"active": 1
}
}
*/
const result = {};
const propertyMap = Object.fromEntries(Object.keys(data).map((key) => [key.split('_').shift(), key]));
for (const property in propertyMap) {
for (const key in data[propertyMap[property]]) {
result[key] ??= {};
result[key][property] = data[propertyMap[property]][key];
}
}
for (const key in result) {
for (const property in propertyMap) {
if (property in result[key] === false) {
result[key][property] = null;
}
}
}
console.log(result);
/*
{
"Машины и оборудование прочие, не включенные в другие группировки": {
"active": 1,
"inactive": 2
},
"Насосное оборудование, комлектующие, сопутствующие": {
"active": 1,
"inactive": 2
},
"Электродвигатели, генераторы и трансформаторы силовые": {
"active": 1,
"inactive": 2
},
"Средства транспортные прочие, не включенные в другие группировки": {
"active": 1,
"inactive": null
}
}
*/