<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
var i;
for (i = 0; i < array.length; i++)
через css хочу скрыть его, когда пуст
.wishlist_products_counter_number:empty {
display: none;
}
document.addEventListener('keydown', e => {
e.preventDefault();
return false;
});document.addEventListener('keydown', e => {
if (e.key === 'ArrowDown') {
e.preventDefault();
//Ваша логика
return false;
}
});Да, существуют бесплатные аналоги плагина Intro.js для создания обучающих подсказок на сайте. Вот несколько вариантов:
1) Driver.js - простой в использовании JS плагин с открытым исходным кодом. Позволяет создавать подсказки и обучающие туры по сайту.
2) Hopscotch - еще одна библиотека для создания подсказок с открытым кодом. Легко настраиваемая и кастомизируемая.
3) Joyride - плагин на jQuery для пошаговых инструкций по сайту. Прост в интеграции.
4) Tourist.js - реализует подсказки в стиле попапов с подсветкой элементов. Небольшой размер.
5) Bootstrap Tour - создан на основе популярного фреймворка Bootstrap. Интуитивно понятный интерфейс.
Посмотрите демо этих плагинов, выберите понравившийся по функционалу и простоте использования. Для быстрого старта оптимально подойдут Driver.js или Hopscotch. Удачи!
let Table = this.$refs.theTable
// rows
for(let rowIndex = 0; rowIndex < Table.rows.length; rowIndex++) {
let row = Table.rows[rowIndex];
// cells
for(let cellIndex = 0; cellIndex < row.cells.length; cellIndex++) {
// is data?
if(this.allDataOfDays[cellIndex] && this.allDataOfDays[cellIndex][rowIndex]) {
row.cells[cellIndex].innerText = this.allDataOfDays[cellIndex][rowIndex];
}
}
}
<script setup>
import { computed } from 'vue'
const ifShow = computed(() => {
return (isShow) => isShow === 'some day'
})
</script>
<template>
<span v-show="ifShow('some day')">Hi!</span>
</template>export default {
data() {
return {}
},
computed: {
ifShow() {
return (isShow) => isShow === 'some day'
}
}
}
data: () => ({
selected: null,
...
}),<tr v-for="(n, i) in (selected || objSearch)">@click="selected = selected ? null : { [i]: n }".hidden {
visibility: hidden;
}<tr
v-for="(n, i) in objSearch"
:class="{ hidden: selected !== null && selected !== i }"
>@click="selected = selected === null ? i : null"
v-for индексы, которые затем проверяйте в v-if ячеек с rowspan'ами - рендерить их нужно только при нулевых значениях.objects[0]? Неужели в objects может быть только один элемент? Заверните то, что сейчас есть в ещё один template, в котором будет v-for по элементам objects.v-for.methods: {
rowspan: attr1 => attr1.reduce((acc, n) => acc + n.attr3.length + 1, 0),
},<template v-for="obj in objects">
<template v-for="{ road, attr1, TOTAL } in obj.data">
<template v-for="({ attr2, attr3, attr4 }, iAttr1) in attr1">
<tr v-for="(attr3Item, iAttr3) in attr3">
<td :rowspan="rowspan(attr1)" v-if="!iAttr1 && !iAttr3">{{ road }}</td>
<td :rowspan="attr3.length" v-if="!iAttr3">{{ attr2 }}</td>
<td>{{ attr3Item.road }}</td>
<td>{{ attr3Item.cargo }}</td>
<td>{{ attr3Item.amount }}</td>
<td>{{ attr3Item.wo_nds }}</td>
</tr>
<tr>
<td colspan="2">Итого {{ attr2 }}:</td>
<td>{{ attr4.cargo }}</td>
<td>{{ attr4.amount }}</td>
<td>{{ attr4.wo_nds }}</td>
</tr>
</template>
<tr>
<td colspan="3">Итого {{ road }}:</td>
<td>{{ TOTAL.cargo }}</td>
<td>{{ TOTAL.amount }}</td>
<td>{{ TOTAL.wo_nds }}</td>
</tr>
</template>
</template>
let first = [ {name: 'Maxim', secondName: 'Ivanov'}, {name: 'Lena', secondName: 'Kirolova'} ];
let second = [ {age: 20}, {age: 18} ];
let third = first.map((item, index) => ({...item, ...second[index]}));
console.log(third);
