function split(arr, numParts) {
const partSize = arr.length / numParts | 0;
return Array
.from({ length: numParts }, (n, i) => i * partSize)
.map((n, i, a) => arr.slice(n, a[i + 1]));
}
function split(arr, numParts) {
const partSize = arr.length / numParts | 0;
const numLooseItems = arr.length % numParts;
return Array.from(
{ length: numParts },
function(_, i) {
return arr.slice(this(i), this(i + 1));
},
i => i * partSize + Math.min(i, numLooseItems)
);
}
coords.reduce((acc, n, i, a) => (
acc.push(n),
(n.line !== a[i + 1]?.line) && acc.push({ ...n, value: 0 }),
acc
), [])
coords.flatMap((n, i, a) =>
i === ~-a.length || n.line !== a[-~i].line
? [ n, { ...n, value: 0 } ]
: n
)
data() {
return {
isChecked: false,
}
},
methods: {
toggleSwitch() {
this.isChecked = !this.isChecked
this.$emit('input', this.isChecked)
},
},
props: {
value: Boolean,
},
- :class="{ 'ivu-switch-checked': isChecked }"
+ :class="{ 'ivu-switch-checked': value }"
- @click.prevent="toggleSwitch"
+ @click.prevent="$emit('input', !value)"
elem.classList.add('check'); elem.querySelector('input[type="checkbox"]').remove();
data: () => ({
tasks: [],
taskId: 0,
newTaskText: '',
}),
methods: {
addTask() {
this.tasks.push({
id: ++this.taskId,
text: this.newTaskText,
done: false,
edit: false,
});
this.newTaskText = '';
},
},
<ul>
<li v-for="(n, i) in tasks" :key="n.id" :class="{ check: n.done }" @dblclick="n.edit = !n.done">
<input type="checkbox" v-if="!n.done" v-model="n.done">
<input type="text" v-if="!n.done && n.edit" v-model="n.text" @keyup.enter="n.edit = false">
<template v-else>{{ n.text }}</template>
<input type="button" class="del" value="+" @click="tasks.splice(i, 1)">
</li>
</ul>
<input type="text" v-model="newTaskText" @keyup.enter="addTask">
const data = Array.prototype.reduce.call(
document.querySelector('form').elements,
(acc, { name, value }) => (
name.match(/\w+/g).reduce((p, c, i, a) =>
p[c] ??= (-~i < a.length ? {} : value)
, acc),
acc
),
{}
);
Для
<input type="text" name="iuowye[rrr][]" value="1"> <input type="text" name="iuowye[rrr][]" value="2"> <input type="text" name="iuowye[rrr][]" value="3">
работать не будет.
const data = Array
.from(document.querySelectorAll('form [name]'))
.reduce((acc, n) => {
const keys = n.name.match(/\w+|\[\w*\]/g).map(n => n.replace(/^\[|\]$/g, ''));
const key = keys.pop();
const isArr = !key;
const values = keys.reduce((p, c, i, a) => {
return p[c] ??= (i === a.length - 1 && isArr ? [] : {});
}, acc);
values[isArr ? values.length : key] = n.value;
return acc;
}, {});
setValue(value === e.target.value);
value ===
.setValue(Math.min(max, Math.max(min, e.target.value)));
Хотел реализовать тоже самое с двойным range слайдером и оказалось несколько сложнее.
function sum(...v1) {
const s = v1.reduce((acc, n) => acc + n, 0);
const f = (...v2) => v2.length ? sum(...v2, s) : s;
return v1.length ? f : s;
}
{cats.map((cat, index) => (
<li key={cat.description} className="catsItem">
<img src={catsImg[index]} alt=""/>
...
const selector = '.text';
const regex = /@(\w+)/g;
const replacement = '<a href="https://site.com/$1">$&</a>';
const replace = str => str.replace(regex, replacement);
$(selector).html((i, html) => replace(html));
// или
document.querySelectorAll(selector).forEach(n => {
n.innerHTML = replace(n.innerText);
});
lower = next((n for n in reversed(lst) if n <= num), float('-inf'))
upper = next((n for n in lst if n >= num), float('inf'))
print([ lower, upper ])
() =>
перед openLightboxOnSlide(key)
(кстати, а какого хрена переменная, содержащая индекс, названа key?).null
, или -1
) - это будет означать, что показывать ничего не надо:const [ lightIndex, setLightIndex ] = useState(null);
<img onClick={() => setLightIndex(key)} />
<ReactBnbGallery
photos={photos}
show={lightIndex !== null}
activePhotoIndex={lightIndex}
onClose={() => setLightIndex(null)}
/>
return [...el].map((n) => new Select(n));
Select
на this.constructor
. const checkedTexts = (el, selector) =>
Array.from(el.querySelectorAll(`${selector}:checked`), n => n.parentNode.innerText);
const propertyText = (el, selector) =>
el.querySelector(selector).innerText.split(': ')[1];
document.querySelector('.container-filter').addEventListener('input', function() {
const maxPrice = parseInt(this.querySelector('.range').value);
const brands = checkedTexts(this, '.input');
const years = checkedTexts(this, '.input-date');
document.querySelectorAll('.device .laptop').forEach(n => {
const price = parseInt(propertyText(n, '.laptop-price'));
const brand = propertyText(n, '.laptop-name');
const year = propertyText(n, '.laptop-year');
n.style.display = (
(maxPrice >= price) &&
(!brands.length || brands.includes(brand)) &&
(!years.length || years.includes(year))
)
? 'block'
: 'none';
});
});