div {
color: red !important;
}<template>
<swiper v-if="isShown" ref="mySwiper" :options="swiperOption">
<swiper-slide>
<div class="slideItem"></div>
</swiper-slide>
</swiper>
</template>import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
import 'swiper/css/swiper.css'
export default {
name: 'SwiperCarousel',
components: {
Swiper,
SwiperSlide
},
data() {
return {
isShown: false,
swiperOption: {
// direction: 'vertical',
}
}
},
mounted() {
const media = window.matchMedia('(max-width:768px)');
const listener = e => this.isShown = e.matches;
listener(media);
media.addListener(listener);
this.$once('hook:beforeDestroy', () => media.removeListener(listener));
}
}Желательно что бы мало весилрантайм минимален и только то, что по факту используется
мобильный браузер долго не обрабатывалкомпилируется в высокоэффективный нативный DOM api, что делает его мега быстрым
плагин хватало на стандартные функционалыНачать поиск отсюда можно
import {render, staticRenderFns} from './messager.pug';declare module '*.pug' {} иdeclare module '*.scss' в каком нить .d.ts файле в корне проекта
Я уже некоторое время прям ломаю себе голову и не могу найти наиболее эффективное решение.и
Но сейчас встает вопрос сроков и бюджетакак то не сходится...
<script>
export default {
data() {
return {
animals: [{
name: "spider",
params: {
size: '',
legsCount: '',
weight: ''
}
}, {
name: "dog",
params: {
weight: '',
breed: '',
height: '',
color: ''
}
}]
};
}
};
</script>
<template>
<form>
<fieldset v-for="animal of animals" :key="animal.name">
<legend>{{animal.name}}</legend>
<label v-for="(_, param) in animal.params" :key="`${animal.name}::${param}`">
<span>{{param}}:</span>
<input v-model="animal.params[param]">
</label>
</fieldset>
</form>
</template>const el = this.forms.find((f, idx) => idx === x);Скажите мне, зачем? Зачем нужно гонять ЦИКЛ ради того что бы достать элемент массива по индексу?const el = this.forms[x];даст абсолютно аналогичный результат, но не сожрет кучу тактов моего процессора...
data() {
return {
showMobileMenu: false
};
},
mounted() {
const mediaQuery = window.matchMedia("(min-width:768px)");
this.showMobileMenu = mediaQuery.matches;
const listener = e => this.showMobileMenu = e.matches;
mediaQuery.addListener(listener);
this.$once('hook:beforeDestroy', () => mediaQuery.removeListener(listener));
}