Переписал код с ES5 на ES6
data: () => ({
show: false
})
<button @click="show = !show">{{ show ? 'hide' : 'show' }}</button>
<my-component v-if="show"></my-component>
data: () => ({
items: []
}),
methods: {
add() {
this.items.push(...);
}
}
<button @click="add">add</button>
<my-component v-for="n in items"></my-component>
const adjacentElementsProduct = arr => arr
.sort((a, b) => a - b)
.slice(-2)
.reduce((acc, n) => acc * n, 1);
const fileIndex = this.files.indexOf(fileInArr);
this.$set(this.files, fileIndex, response.data);
input:focus::placeholder {
color: transparent;
}
arr = arr.filter(n => n.id !== ID);
arr.splice(arr.findIndex(n => n.id === ID), 1);
const index = arr.findIndex(n => n.id === ID);
if (index !== -1) {
arr.splice(index, 1);
}
function toggleClass(selector, className, delay) {
let index = -1;
return setInterval($items => {
$items.eq(index).removeClass(className);
index = (index + 1) % $items.length;
$items.eq(index).addClass(className);
}, delay, $(selector));
}
const intervalId = toggleClass('.wrap div', 'active', 300);
function toggleClass(selector, className, delay) {
const items = document.querySelectorAll(selector);
let index = ~-items.length;
return items.length
? setInterval(() => {
items[index].classList.remove(className);
index = -~index % items.length;
items[index].classList.add(className);
}, delay)
: null;
}
data: () => ({
value: '',
error: false
}),
methods: {
checkValue() {
this.error = в зависимости от this.value;
}
}
<input v-model="value" :class="{ error }" @blur="checkValue">
<span v-show="error">ошибка</span>
.error {
border-color: red;
}
Как можно его подключить в проект без использования webpack, vue-cli?
document.querySelectorAll('.item-parent').forEach(n => {
n.insertAdjacentHTML('beforeend', '<div class="item-decor"></div>');
});
for (const n of document.getElementsByClassName('item-parent')) {
const div = document.createElement('div');
div.classList.add('item-decor');
n.appendChild(div);
}
v-model
:input.value = какое-то значение;
input.dispatchEvent(new Event('input'));