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 = 0;
const intervalID = setInterval(() => {
flip($items.eq(i));
if (++i >= $items.length) {
clearInterval(intervalID);
}
}, 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;
}
$filtered = array_slice(array_filter($search_results, function($n) {
return условие;
}), 0, 5);
$filtered = [];
foreach ($search_results as $n) {
if (условие) {
$filtered[] = $n;
}
if (count($filtered) === 5) {
break;
}
}
const [ arr1, arr2 ] = arr.list
.map(n => [ n, +n.pos.dv.slice(1) ])
.sort((a, b) => a[1] - b[1])
.reduce((acc, n) => (acc[+(n[1] >= 38)].push(n[0]), acc), [ [], [] ])
.map(n => ({ list: n }));