// Загрузка городов
let cities_items = await getCities({
country_id: 3159,
offset: 0,
count: 50
});
// Загрузка регионов
let regions_items = await getRegions({
country_id: 3159
});
const max_cols = 4
let regions = []
let regions_size = Math.ceil(regions_items.length / max_cols); //размер подмассива
for (let i = 0; i < Math.ceil(regions_items.length / regions_size); i++) {
regions[i] = regions_items.slice((i * regions_size), (i * regions_size) + regions_size);
}
let cities = []
let cities_size = Math.ceil(cities_items.length / max_cols); //размер подмассива
for (let i = 0; i < Math.ceil(cities_items.length / cities_size); i++) {
cities[i] = cities_items.slice((i * cities_size), (i * cities_size) + cities_size);
}
<v-row>
<v-col md="12" cols="12">
<v-card class="pb-5">
<v-card-title>Популярные города</v-card-title>
<v-card-text>
<v-row>
<v-col
md="3"
sm="6"
cols="12"
v-for="(cities_item, cities_index) in cities"
:key="cities_index"
class="pa-0 text-left"
>
<ul>
<li v-for="(item, index) in cities_item">{{ item.name }}</li>
</ul>
</v-col>
</v-row>
</v-card-text>
</v-card>
</v-col>
<v-col md="12" cols="12">
<v-card class="pb-5">
<v-card-title>Регионы России</v-card-title>
<v-card-text>
<v-row>
<v-col
md="3"
sm="6"
cols="12"
v-for="(regions_item, region_index) in regions"
:key="region_index"
class="pa-0 text-left"
>
<ul>
<li v-for="(item, index) in regions_item">{{ item.name }}</li>
</ul>
</v-col>
</v-row>
</v-card-text>
</v-card>
</v-col>
</v-row>
document - текущий документ
getElementById() - метод получения элемента используя id
onchange - свойство элемента для обработчика события
function (event){} - анонимная функция (обработчик события)
event - локальная переменная в контексте анонимной функции
target - таргет он и в африке таргет (целевой элемент, где происходит туса)
parentNode - родительская нода
childNodes[1] - у родителя есть дети
data - у детей есть данные
slice(1) - отхренашить кусочек
currentKey - отхренашеный кусочек
window.onload = function() {
// браузер загрузил HTML и внешние ресурсы (картинки, стили и т.д.).
};
events()
{
let search = debounce(async ({e, value, f}) => {
let response = await Digest.fastSearch({
q: value
})
f(response.items)
}, 1000)
this.$root.$on("on-root-main-search-change", async ({e, value, f}) => {
search({e, value, f})
})
}
Он заключается в том, что если у нас есть много элементов, события на которых нужно обрабатывать похожим образом, то вместо того, чтобы назначать обработчик каждому – мы ставим один обработчик на их общего предка. Из него можно получить целевой элемент event.target, понять на каком именно потомке произошло событие и обработать его.