const newData = data.reduce((acc, n) => {
const k = Object.keys(n)[0];
(acc.result[acc.keys[k] = (acc.keys[k] ?? -1) + 1] ??= []).push(n);
return acc;
}, { result: [], keys: {} }).result.flat();
const numKeys = new Set(data.flatMap(Object.keys)).size;
const numObjs = data.length / numKeys;
const newData = data.map((n, i, a) => a[(i % numKeys) * numObjs + (i / numKeys | 0)]);
const selector = 'селектор элементов';
const className = 'класс';
const minChildrenCount = 666;
for (const n of document.querySelectorAll(selector)) {
n.classList.toggle(className, n.children.length >= minChildrenCount);
}
// или (нет, так делать точно не надо - для 0 результат будет некорректным)
document
.querySelectorAll(`${selector} > :nth-child(${minChildrenCount})`)
.forEach(n => n.parentNode.classList.add(className));
(function toArrays(obj) {
const arr = Object.values(obj ?? {});
arr.forEach(n => n.children = toArrays(n.children));
return arr;
})(arr.reduce((acc, n) => {
const path = n.path.replace(/^\/|\/$/g, '').split('/');
const obj = path.reduce((p, c) => ((p.children ??= {})[c] ??= {}), acc);
Object.assign(obj, n);
return acc;
}, {}).children)
computed: {
component() {
/*
* здесь возвращаете имя компонента, в зависимости от... это вам виднее;
* если действительно будет так, как показано в вопросе - натуральные числа
* соответствуют компонентам, то можно сложить имена компонентов в массив:
* return [ 'component-1', 'component-2', 'component-3' ][this.x - 1];
*/
},
},
<component :is="component" />
computed: {
linesCount() {
return 1 + (this.text.match(/\n/g)?.length ?? 0);
},
},
<div>{{ linesCount }}</div>
<div class="mainMenu">
<button data-scroll-to="calendar">Раз</button>
<button data-scroll-to="rooms">Два</button>
<button data-scroll-to="maps">Три</button>
<button data-scroll-to="contact">Четыре</button>
</div>
...
<div data-block="calendar">...</div>
<div data-block="rooms">...</div>
<div data-block="maps">...</div>
<div data-block="contact">...</div>
function scrollTo(block) {
document.querySelector(`[data-block="${block}"]`).scrollIntoView({
block: 'center',
behavior: 'smooth',
});
}
document.querySelector('.mainMenu').addEventListener('click', e => {
const block = e.target.dataset.scrollTo;
if (block) {
scrollTo(block);
}
});
// или
document.querySelectorAll('[data-scroll-to]').forEach(function(n) {
n.addEventListener('click', this);
}, e => scrollTo(e.target.dataset.scrollTo));
const punct = '.,!?;:"\'”“';
const numStrWithPunctEnd = 3;
const arr = str.split('\n');
const index = arr.findIndex(function(n, i, a) {
return this.every(m => punct.includes(a[i + m]?.slice(-1)));
}, [...Array(numStrWithPunctEnd).keys()]);
const result = index !== -1 ? arr.slice(index).join('\n') : str;
const obj = {
a: 69,
b: 187,
c: 666,
};
const proxy = new Proxy(obj, {
set(target, key, val) {
console.log(`${key} changed from ${target[key]} to ${val}`);
target[key] = val;
return true;
},
});
computed: {
categories() {
return this.posts.data.reduce((acc, n) => (
(acc[n.category_name] ??= {
name: n.category_name,
posts: [],
}).posts.push(...n.posts),
acc
), {});
},
...
<div v-for="category in categories">
<h3>{{ category.name }}</h3>
<div v-for="post in category.posts">
{{ post.title }}
</div>
</div>
С чего начать изучение языка?
ref указанный так указывает на Proxy а не на элемент. Как это исправить?
function getDates(startStr, count) {
const dates = [];
const date = new Date(startStr.split('.').reverse().join('-'));
const day = date.getDate();
date.setDate(0);
while (dates.length < count) {
date.setMonth(date.getMonth() + 2, 0);
date.setDate(Math.min(date.getDate(), day));
dates.push(date.toLocaleDateString('ru-RU', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
}));
}
return dates;
}