.html($(this).find('img')).html($(this).find('img').clone())
class App extends React.Component {
state = {
maxCount: 55,
people: [],
url: 'https://swapi.dev/api/people/',
}
fetchPeople() {
fetch(this.state.url).then(r => r.json()).then(r => {
this.setState(({ people, maxCount }) => ({
people: [ ...people, ...r.results ].slice(0, maxCount),
url: r.next,
}));
});
}
updateGenderCount() {
this.setState(({ people }) => ({
genderCount: people.reduce((acc, n) => {
acc[n.gender] = (acc[n.gender] || 0) + 1;
return acc;
}, {}),
}));
}
componentDidMount() {
this.fetchPeople();
}
componentDidUpdate(prevProps, prevState) {
const count = this.state.people.length;
if (count !== prevState.people.length) {
this.updateGenderCount();
if (this.state.url && count < this.state.maxCount) {
this.fetchPeople();
}
}
}
render() {
return (
<div>
<pre>{JSON.stringify(this.state.genderCount, null, 2)}</pre>
</div>
);
}
}
.items-left, а проверяете количество .items-right. Думали, что класс сам собой заменится? Нет, так не будет.
$('#dateStart').trigger('change');this.dispatchEvent(new Event('input'));
document.querySelector('.items').addEventListener('click', function(e) {
const t = e.target;
if (t.classList.contains('item')) {
map.setCenter([ t.dataset.lat, t.dataset.lng ]);
}
});
:curPage="defineCurPage":cur-page="defineCurPage".
const getImg = url => fetch(url)
.then(r => r.blob())
.then(blob => new Promise(resolve => {
const reader = new FileReader();
reader.addEventListener('loadend', () => resolve({ image: reader.result }));
reader.readAsDataURL(blob);
}));
document.querySelector('button').addEventListener('click', async () => {
const arrImg = await Promise.all(arr.map(n => getImg(`./images/${n}`)));
console.log(arrImg);
});
data: () => ({
newTask: '',
items: {},
}),
watch: {
items: {
deep: true,
handler: val => localStorage.setItem('items', JSON.stringify(val)),
},
},
methods: {
addTask() {
const title = this.newTask.trim();
if (title) {
const id = 1 + Math.max(0, ...Object.values(this.items).flat().map(n => n.id));
this.items.A.push({ id, title });
} else {
alert('Введите текст задачи');
}
this.newTask = '';
},
},
created() {
let items = null;
try {
items = JSON.parse(localStorage.getItem('items'));
} catch (e) {}
this.items = items || дефолтное значение;
},<div>
<input placeholder="текст задачи" v-model="newTask">
<button @click="addTask">+</button>
</div>
<draggable
v-for="(v, k) in items"
v-model="items[k]"
:key="k"
:options="{ group: 'tasks' }"
element="ul"
class="connectedSortable"
>
<li v-for="item in v" :key="item.id">{{ item.title }}</li>
</draggable>
const $items = $('.card');
const openedClass = 'card--opened';
const closedClass = 'card--closed';
const delay = 500;
const flip = $item => $item.removeClass(closedClass).addClass(openedClass);$items.each((i, n) => setTimeout(flip, (i + 1) * delay, $(n)));(function next(i) {
if (i < $items.length) {
setTimeout(() => {
flip($items.eq(i));
next(-~i);
}, delay);
}
})(0);let i = -1;
const intervalID = setInterval(() => {
if (++i >= $items.length) {
clearInterval(intervalID);
} else {
flip($items.eq(i));
}
}, delay);
const obj = array.reduce((acc, n, i) => (
acc[`filter${i + 1}`] = { ...baseFilter, prop: n },
acc
), {});const obj = {};
for (const [ i, n ] of array.entries()) {
(obj['filter' + (-~i)] = Object.assign({}, baseFilter)).prop = n;
}const obj = {};
for (let i = 0; i < array.length;) {
const subobj = { prop: array[i] };
for (const k in baseFilter) {
subobj[k] = baseFilter[k];
}
obj['filter'.concat(++i)] = subobj;
}
const itemsSelector = '.block';
const wrapperTag = 'div';
const wrapperClass = 'parent';const $items = $(itemsSelector);
$items.each(i => $items
.eq(i)
.nextUntil($items.get(i + 1))
.wrapAll(`<${wrapperTag} class="${wrapperClass}">`)
);document.querySelectorAll(itemsSelector).forEach((n, i, a) => {
const elems = [];
for (let el = n; (el = el.nextElementSibling) != a[-~i]; elems.push(el)) ;
n.after(document.createElement(wrapperTag));
n.nextSibling.classList.add(wrapperClass);
n.nextSibling.append(...elems);
});