id="link"
.this
; а вместо того, чтобы выдумывать какие-то стрёмные id для блоков которые надо показать, поднимайтесь при клике до общего предка блока и кликнутого элемента, и ищите блок через querySelector
:onclick="showTooltip(this)"
function showTooltip(link) {
const div = link.parentNode.querySelector('div');
if (div.style.display === 'none') {
div.style.display = 'block';
link.style.display = 'none';
} else {
div.style.display = 'none';
}
}
document.querySelectorAll('.contacts-number a').forEach(n => {
n.addEventListener('click', onClick);
});
function onClick() {
const div = this.closest('.contacts-number').querySelector('div');
if (div.style.display === 'none') {
div.style.display = 'block';
this.style.display = 'none';
} else {
div.style.display = 'none';
}
}
пока кроме ошибок ничего не получил
document.querySelectorAll('.test').forEach(n => {
n.textContent = n.textContent.replace(/\bAenean\b/g, 'Aenean1');
});
// или
for (const n of document.getElementsByClassName('test')) {
n.innerText = n.innerText.replace(/\bAenean\b/g, '$&1');
}
console.log(this.$store) - этот экшн видит
spoiler
this.$store.originalDispatch('setCategory', cat)
. next({
name: 'здесь имя маршрута, придумайте сами',
params: data,
})
this.$route.params
. Если надо, чтобы свойства params передавались в параметры компонента, также добавьте в описание маршрута props: true
. $header = "<tr>".implode("", array_map(function($n) {
return "<th>$n</th>";
}, array_keys($array)))."</tr>";
$rowsCount = max(array_map(function($n) {
return count($n);
}, $array));
$rows = implode("", array_map(function($i) use($array) {
foreach ($array as $item) {
$row[]= "<td>".(isset($item[$i]) ? $item[$i] : "")."</td>";
}
return "<tr>".implode("", $row)."</tr>";
}, range(0, $rowsCount - 1)));
echo "<table>$header$rows</table>";
const $buttons = $('здесь селектор ваших кнопок').click(function() {
$slick.slick('slickGoTo', $buttons.index(this));
});
$slick.on('init beforeChange', function(e, slick, currSlide, nextSlide) {
$buttons
.removeClass('active')
.eq(e.type === 'init' ? slick.currentSlide : nextSlide)
.addClass('active');
});
необходимо отлавливать событие скроллинга
что-то вроде $element.bind('mousewheel',
<div @wheel="onWheel" @scroll="onScroll">
methods: {
onWheel() {
console.log('wheel');
},
onScroll() {
console.log('scroll');
},
},
this.$set(this.arrB, i, 'значение')
<div>
<button data-step="-1">-</button>
<button data-step="+1">+</button>
</div>
<textarea cols="30" rows="10"></textarea>
const history = JSON.parse(localStorage.getItem('history')) || [];
let index = history.length - 1;
const $text = $('textarea').change(function() {
index = history.push($text.val()) - 1;
localStorage.setItem('history', JSON.stringify(history));
});
$('[data-step]').click(function() {
goTo(index + +this.dataset.step);
});
goTo(index);
function goTo(newIndex) {
if (0 <= newIndex && newIndex <= history.length - 1) {
index = newIndex;
$text.val(history[index]);
}
}
с data-table vuetify она не работает
<v-data-table
ref="table"
...
table
:mounted() {
new ColumnResizer.default(this.$refs.table.$el.querySelector('table.v-datatable'), {
liveDrag: true,
draggingClass: 'rangeDrag',
gripInnerHtml: '<div class="rangeGrip"></div>',
minWidth: 8,
});
},
arr.map(id => people.find(n => n.id === id))
// или
arr.map(function(n) {
return this[n];
}, people.reduce((acc, n) => (acc[n.id] = n, acc), {}))
people.filter(n => arr.includes(n.id))
// или
people.filter(((ids, n) => ids.has(n.id)).bind(null, new Set(arr)))
<ul>
<li><span>aaa</span></li>
<li>
<span>bbb</span>
<ul>
<li><span>bbb.1</span></li>
<li>
<span>bbb.2</span>
<ul>
<li><span>bbb.2.1</span></li>
<li><span>bbb.2.2</span></li>
</ul>
</li>
<li>
<span>bbb.3</span>
<ul>
<li>
<span>bbb.3.1</span>
<ul>
<li><span>bbb.3.1.1</span></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
document.querySelectorAll('li').forEach(n => {
const count = n.querySelectorAll(':scope > ul > li').length;
n.querySelector('span').append(` (${count})`);
});
for (const n of document.getElementsByTagName('li')) {
const { length: count } = n.getElementsByTagName('li');
n.children[0].insertAdjacentText('beforeend', ' (' + count + ')');
}
При изменении item.department меняется и item_loaded.department
this.item_loaded = this.item
this.item_loaded = { ...this.item }
data() {
return {
item_loaded: { ...this.item },
};
},
isChanged() {
return this.item_loaded.department !== this.item.department;
},
cannot read property of null
. Должен быть объект:default: () => ({ /* можно указать какие-нибудь свойства с дефолтными значениями */ }),
v-model="item.department"
). Правильно будет эмитить изменения в родительский компонент и обновлять объект уже там. В родителе цепляете значение для параметра item с модификатором sync, а в рассматриваемом компоненте v-model
заменяете на установку значения и обработку события input:<input
:value="item.department"
@input="$emit('update:item', { ...item, department: $event.target.value })"
>