<div class="1">
transition
, добавить анимацию: animation: show 10s;
.@keyframes show {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
<thead v-if="options.head">
...
<tbody v-if="options.body">
const getChunks = (arr, chunkSize) =>
Array.from(
{ length: Math.ceil(arr.length / chunkSize) },
(n, i) => arr.slice(i * chunkSize, (i + 1) * chunkSize)
);
// или
const getChunks = (arr, chunkSize) =>
arr.reduce((acc, n, i) => (
i = i / chunkSize | 0,
(acc[i] = acc[i] || []).push(n),
acc
), []);
// или
const getChunks = (arr, chunkSize) =>
arr.reduce((acc, n, i) => (
(i % chunkSize) || acc.push([]),
acc[acc.length - 1].push(n),
acc
), []);
const arr = [...Array(50).keys()];
const chunks = getChunks(arr, 7);
const links = document.querySelectorAll('a');
// или
const links = document.getElementsByTagName('a');
const getHref = el => el.getAttribute('href');
// или
const getHref = el => el.attributes.href.value;
const hrefs = Array.from(links, getHref);
// или
const hrefs = Array.prototype.map.call(links, getHref);
// или
const hrefs = [];
for (const n of links) {
hrefs.push(getHref(n));
}
// или
const hrefs = [];
for (let i = 0; i < links.length; i++) {
hrefs[i] = getHref(links[i]);
}
// или
const hrefs = (function get(i, n = links.item(i)) {
return n ? [ getHref(n), ...get(i + 1) ] : [];
})(0);
Ведь у пустого массива есть численное представление: +[] вернет 0.
false+[]
нет преобразования массива в число. Есть сложение - массив преобразовывается в строку, false тоже. Если интересуют детали - можете ознакомится со спецификацией. methods: {
trans
}
В state.FIELDS.formFieldsMap
данные лежат
Действительно, а как тогда быть?
getters: {
transportFields: state => state.FIELDS.formFieldsMap || [],
...
mutations: { [GET_USER_INFO](state) { axios.get('http://localhost:3000/user') ...
хочется, чтоб saveProfile или действие, которое внутри - this.$store.dispatch('loadInfo') вызывалось сразу после того, как загружено начальное состояние
<alien-component :value="value" @input="$emit('input', this.$event.target.value)" />
<alien-component
:value="value"
@input="$emit('input', $event)"
/>
Хочу получить метод из родителя родителя.
<div id="sound-btn-wrapper">
<div class="btn btn-start">On</div>
<div class="btn btn-stop">Off</div>
</div>
const audio = new Audio('...');
$('#sound-btn-wrapper').on('click', '.btn', function() {
audio.pause();
if ($(this).hasClass('btn-start')) {
audio.currentTime = 0;
audio.play();
}
});
<el-select :value="item2.select.value" @input="onInput(item2.name, $event)">
methods: {
onInput(propName, propVal) {
this.$store.commit('updateForm', { propName, propVal });
},
},
When there is only one single-line text input field in a form, the user agent should accept Enter in that field as a request to submit the form.
@keypress.enter.prevent
. function simpleSlider(element) {
const root = typeof element === 'string'
? document.querySelector(element)
: element;
const items = root.querySelectorAll('.slider__item');
const prev = root.querySelector('.slider__btn-prev');
const next = root.querySelector('.slider__btn-next');
let index = 0;
function slideTo(newIndex) {
items[index].classList.remove('slider__item--active');
index = (newIndex + items.length) % items.length;
items[index].classList.add('slider__item--active');
}
prev.addEventListener('click', () => slideTo(index - 1));
next.addEventListener('click', () => slideTo(index + 1));
}
simpleSlider('#slider1');
simpleSlider(document.querySelector('#slider2'));