делаю все как показано в примере в оф. репозитории
API: Container
Component that contains the draggable elements or components. Each of its children should be wrapped by Draggable component
<Container @drop="$emit('drop', row.id)" :get-child-payload="getChildPayload"> <div class="row">
const result = arr1.map((n, i) => {
const index = Math.min(i * 2, ((arr2.length - 2) / 2 | 0) * 2);
return `name: ${n} val1: ${arr2[index]} val2: ${arr2[index + 1]}`;
});
result.forEach(alert);arr.reduce((acc, n, i) => (
(i && (acc[~-acc.length].length + !(acc.length & 1) !== 3)) || acc.push([]),
acc[~-acc.length].push(n),
acc
), [])с перезагрузкой страницы
el.remove()) или делайте неактивными (el.disabled = true). Например:<form @submit="onSubmit">
<div v-for="(v, k) in formData">
<div>{{ k }}:</div>
<div><input v-model="formData[k]" :name="k" :ref="k"></div>
</div>
<button>submit</button>
</form>data: () => ({
formData: {
forename: '',
surname: '',
email: '',
},
}),
methods: {
onSubmit() {
Object.entries(this.formData).forEach(([ k, v ]) => !v && (this.$refs[k][0].disabled = true));
},
},const className = 'text';.{ старый_текст: новый_текст }:const months = Object.fromEntries(Array.from({ length: 12 }, (n, i) => {
const d = new Date(0, i);
return [
d.toLocaleString('en-US', { month: 'long' }),
d.toLocaleString('ru-RU', { month: 'long' }).replace(/./, m => m.toUpperCase()),
];
}));$('.' + className).text((i, text) => months[text.trim()]);
// или
document.querySelectorAll(`.${className}`).forEach(n => {
const key = n.innerText;
if (months.hasOwnProperty(key)) {
n.innerText = months[key];
}
});
// или
for (const n of document.getElementsByClassName(className)) {
n.textContent = months[n.textContent.trim()] ?? n.textContent;
}document.querySelector('table').addEventListener('input', e => {
const tr = e.target.closest('tr');
const price = parseInt(tr.querySelector('.price').innerText);
const value = e.target.value;
tr.querySelector('.item_result').innerText = value * price;
});function groupNames(arr) {
const tree = Object.fromEntries(arr.map(n => [ n.categoryId, { ...n, children: [] } ]));
const values = Object.values(tree);
const getNames = ({ name, children }) => children.length
? children.reduce((acc, n) => (
acc.push(...getNames(n).map(m => [ name, ...m ])),
acc
), [])
: [ [ name ] ];
values.forEach(n => tree[n.parentCategoryId]?.children.push(n));
return values
.filter(n => !n.parentCategoryId)
.flatMap(n => getNames(n).map(n => n.join(' - ')));
}Предполагаю, что это связано с...
watch: {
secondList(val) {
if (!val[this.secondElementSelected]) {
this.secondElementSelected = 0;
}
},
},:value="secondList[secondElementSelected]?.elementYes"forEach и for...of. Откройте документацию и разберитесь.forEach нельзя прервать (throw не в счёт), в то время как в теле for...of можно использовать break и return (да, в forEach тоже можно использовать return, но эффект будет не тот - уход на следующую итерацию, т.е., то же, что и continue для for...of).forEach можно назначать контекст выполнения (через второй параметр, коллбек при этом не должен быть стрелочной функцией).forEach отложить запуск следующей итерации до окончания выполнения асинхронных операций, запущенных в текущей итерации. В случае for...of можно добавить async в объявление функции, внутри которой он находится, и использовать await.Symbol.iterator, то это ещё не означает, что и forEach там тоже присутствует. Впрочем, тут могут быть (не всегда), варианты одолжить чужой forEach:Array.prototype.forEach.call('ABC', alert);
NodeList.prototype.forEach.call(document.scripts, console.log);$arr = array_map(function($city, $id, $proc) {
return compact('city', 'id', 'proc');
}, $city, $num, $proc);$('.button').click(function() {
const val = +$('.value').text((i, text) => +text + 1).text();
$('.item')
.removeClass('xxx')
.filter((i, el) => +$(el).text() <= val)
.sort((a, b) => $(a).text() - $(b).text())
.last()
.addClass('xxx');
});document.querySelector('.button').addEventListener('click', () => {
const val = ++document.querySelector('.value').innerText;
const items = Array.from(document.querySelectorAll('.item'), n => [ n, +n.innerText ]);
const max = items.reduce((max, n) => n[1] <= val && n[1] > max ? n[1] : max, -Infinity);
items.forEach(n => n[0].classList.toggle('xxx', n[1] === max));
});