const replaceKeys = (value, replacer) =>
value instanceof Object
? value instanceof Array
? value.map(n => replaceKeys(n, replacer))
: Object.fromEntries(Object
.entries(value)
.map(n => [ replacer(n[0]), replaceKeys(n[1], replacer) ])
)
: value;
const newObj = replaceKeys(obj, k => `${k}_upd`);
function replaceKeys(value, replacer) {
const result = [];
const stack = [];
for (
let i = 0, source = [ [ 0, value ] ], target = result;
i < source.length || stack.length;
i++
) {
if (i === source.length) {
[ i, source, target ] = stack.pop();
} else {
const [ k, v ] = source[i];
const isObject = v instanceof Object;
const newK = target instanceof Array ? k : replacer(k);
target[newK] = isObject ? v.constructor() : v;
if (isObject) {
stack.push([ i, source, target ]);
[ i, source, target ] = [ -1, Object.entries(v), target[newK] ];
}
}
}
return result[0];
}
выбранным оказывается последний добавленный элемент, несмотря на то, что всем добавленным элементам в GetSelected я вернул ' '
v-model
? const regex = /#[a-f\d]+;$/i;
const replacement = '<span class="color" style="background: $&"></span>';
document.querySelectorAll('селектор сами сообразите').forEach(n => {
n.innerHTML = n.innerText.replace(regex, replacement);
});
.product
. Вместо первого .product
нужен тот, внутри которого находится нажатая кнопка:document.querySelector('.wrapper_product')
---> event.target
$value = array_combine($data['value_index'], $data['value'])[min($data['value_index'])];
$value = $data['value'][array_search(min($data['value_index']), $data['value_index'])];
$index = 0;
for ($i = 1; $i < count($data['value_index']); $i++) {
if ($data['value_index'][$i] < $data['value_index'][$index]) {
$index = $i;
}
}
$value = $data['value'][$index];
menu.addEventListener('click', ({ target: t }) => {
if (t.tagName === 'SPAN') {
const parent = t.parentNode;
parent.classList.toggle('active');
for (const n of menu.querySelectorAll('.active')) {
if (n !== parent) {
n.classList.toggle('active', n.contains(parent));
}
}
}
});
- .menu_list_item.active .submenu {
+ .active > .submenu {
- .submenu_list_item.active .product {
+ .active > .product {
const container = document.querySelector('#menu');
const itemSelector = 'li';
const buttonSelector = `${itemSelector} span`;
const activeClass = 'active';
container.addEventListener('click', function(e) {
const item = e.target.closest(buttonSelector)?.closest(itemSelector);
if (item) {
item.classList.toggle(activeClass);
this.querySelectorAll(`.${activeClass}`).forEach(n => {
if (n !== item) {
n.classList.toggle(activeClass, n.contains(item));
}
});
}
});
const items = document.querySelectorAll('.faq__input');
const onChange = ({ target: t }) => t
.closest('.faq__items')
.querySelectorAll('.faq__question--top')
.forEach(n => n.classList.toggle('active', n.nextElementSibling.checked));
items.forEach(n => n.addEventListener('change', onChange));
.faq__item
вместо .faq__question--top
. Если в будущем задумаете стилизовать внутри выбранного .faq__item
элементы, находящиеся за пределами .faq__question--top
, то не придётся переписывать js-код.const itemSelector = '.faq__item';
const radioSelector = '.faq__input';
const activeClass = 'active';
const toggleActiveClass = radioGroupName => document
.querySelectorAll(`${radioSelector}[name="${radioGroupName}"]`)
.forEach(n => n.closest(itemSelector).classList.toggle(activeClass, n.checked));
document.querySelectorAll(radioSelector).forEach(function(n) {
n.addEventListener('change', this);
}, e => toggleActiveClass(e.target.name));
document.addEventListener('change', ({ target: t }) => {
if (t.matches(radioSelector)) {
toggleActiveClass(t.name);
}
});
$values = array_column($array2, 'value');
$result = array_filter($array1, fn($n) => in_array($n->code, $values));
из дочернего мне нужно передать именно ключ b в родительский
this.$emit('do-something')
.<child-component :object="objects.a" @do-something="doSomething('a')" />
<child-component :object="objects.b" @do-something="doSomething('b')" />
<!--> или <-->
<child-component v-for="(v, k) in objects" :object="v" @do-something="doSomething(k)" />
methods: {
doSomething(key) {
// чего-то делаете
},
...
затем пройтись по objects и при совпадении ключей (a, b или c) выполнить действия над значением
<child-component :object="objects.a" @do-something="doSomething(objects.a)" />
<child-component :object="objects.b" @do-something="doSomething(objects.b)" />
<!--> или <-->
<child-component v-for="n in objects" :object="n" @do-something="doSomething(n)" />
this.$emit('do-something', this.object)
. Тогда не придётся дублировать обращение к нему в родителе:<child-component :object="objects.a" @do-something="doSomething" />
<child-component :object="objects.b" @do-something="doSomething" />
<!--> или <-->
<child-component v-for="n in objects" :object="n" @do-something="doSomething" />
function createTree({
arr,
idKey = 'id',
parentKey = 'parentId',
childrenKey = 'children',
}) {
const tree = Object.fromEntries(arr.map(n => [ n[idKey], { ...n, [childrenKey]: [] } ]));
return Object.values(tree).filter(n => !tree[n[parentKey]]?.[childrenKey].push(n));
}
v-tree
, выводящий древовидные данные:props: {
items: {
type: Array,
default: () => [],
},
maxdepth: {
type: Number,
default: Infinity,
},
},
<ul v-if="Array.isArray(items) && items.length && maxdepth">
<li v-for="n in items" :key="n.id">
{{ n.value }}
<v-tree :items="n.children" :maxdepth="maxdepth - 1" />
</li>
</ul>
const result = array2.filter(function(n) {
return this.has(n.code);
}, new Set(array1.map(n => n.value)));
const obj2 = Object.fromEntries(array2.map(n => [ n.code, n ]));
const result = array1.reduce((acc, n) => ((n = obj2[n.value]) && acc.push(n), acc), []);
const result = array2.filter(n => array1.some(m => m.value === n.code));
e.target.dataset.followerStyle
e.target
? Ну, когда вы наводите курсор на слайд с data-атрибутом. На тот слайд, который не видно за вложенной в него картинкой.target
хватать, а пытаться найти у него предка с нужным вам атрибутом. // значения withSeat вместо раскладывания в отдельные переменные собираете в объект
const withSeat = {
adult: 1,
teenager: 1,
babe: 0,
};
const passengers = cabins.flatMap(n => Object
.entries(n)
.flatMap(([ k, v ]) => Array.from(
{ length: v },
() => ({ withSeat: withSeat[k] })
))
);
const obj = Object.fromEntries(Object
.entries(arr.reduce((acc, n) => (
Object.entries(n).forEach(([ k, v ]) => (acc[k] ??= new Set).add(v)),
acc
), {}))
.map(n => [ n[0], n[1].size === 1 ? [...n[1]][0] : null ])
);
v-model.lazy
.def order_weight(string):
return { n: sum(map(int, n)) for n in string.split() }