notify
которая вернёт инстанс со всем управлением и импортируйте где надо.bus.global.emit("notify", {
msg: "New SMS code Requested, Success",
timer: 30,
uid: '<заданный рукамиидентификатор>'
});
notification.get(uid)
, специально для "сложных" случаев. Но это такое себе. import getPRoducts
напиши const getPRoducts = async () => {
return [1, 2, 3]
}
и сможешь в этом убедиться.v-for="(item, index) in currentPageSortedList"
data: {
list: [...bread[0]], // или просто bread? х.з. не ясно, что там
// ...
},
computed: {
sortedList() {
const sort = {
"По популярности": "changePopular",
"По возрастанию цены": "changePlus",
"По уменьшению цены": "changeMinus",
"Сначала обсуждаемые": "changeDiscussed",
"Сначала с лучшей оценкой": "changeBest"
}[this.selected];
// лишний slice здесь для того чтобы клонировать массив
// т.к. sort мутирует исходный
return sort ? this.list.slice().sort(this[sort]) : this.list;
},
currentPageSortedList() {
const perPage = 6;
const position = this.currentPage * perPage;
return this.sortedList.slice(position, position + perPage);;
},
// ...
},
watch: {
// при смене выбора скидываем на первую страницу
selected() {
this.currentPage = 0;
}
}
@mouseout
или @mouseleave
должны сопровождаться @focusout
или @blur
для доступности. @mouseover
, @mouseenter
или @hover
должны сопровождаться @focusin
или @focus
для доступности. @mouseenter
нам может понадобится @focusin
, если нам это советует правило по доступности? Думай, думай...@focus
и @focusin
? </div>
в <template>
.v-on: mouseover="out"
должно быть слитно v-on:mouseover="out"
.data
, methоds
висят в воздухе.<styles>
, а <style>
причём судя по вложенности не просто <style>
, который ожидает обычный css, а <style lang="scss">
.out
и select
.<a>
href="#"
или, лучше, v-on:click.prevent
из-за чего клик по ссылке открывает новую вкладку. А ещё лучше - не использовать <a>
не для сссылок.one
- стока, то назначался класс из этой строки, а не класс .one
, в таком случае выглядеть это должно так: v-bind:class="[one, { stels: stels }]"
или, хуже, v-bind:class="{ [one]: one, stels: stels }"
.v-if="showSwiper"
и переключаете, соответственно, this.showSwiper
. Если v-if="false"
компонент будет разрушен и всё.destroy
, и вам не надо не о чём заботиться. Иногда конечно встречается кривое г-но с текущей памятью, но в таких случях проще самому написать компонент с нуля.// удаляет значение
function removeFieldValue(previous, value) {
if (!previous)
return '';
if (typeof value !== 'string')
value = String(value);
const uniqueValues = splitFieldValues(previous);
uniqueValues.delete(value.trim());
return [...uniqueValues].join(' ');
}
// удаляет значение по его порядковому номеру
function removeFieldValueByIndex(previous, index) {
if (!previous)
return '';
const uniqueValues = [...splitFieldValues(previous)];
uniqueValues.splice(index, 1);
return uniqueValues.join(' ');
}
function concatenateFieldValue(previous, value) {
if (typeof value !== 'string')
value = String(value);
if (!previous)
return value;
const uniqueValues = splitFieldValues(previous);
uniqueValues.add(value.trim());
return [...uniqueValues].join(' ');
}
function splitFieldValues(values) {
return new Set(values.split(' ').filter(Boolean));
}
function getUpdatedQuery(query, field, value) {
return {
...query,
[field]: concatenateFieldValue(query[field], value)
}
}
this.$router.push({
query: getUpdatedQuery(
this.$route.query,
itemNameParent,
e.target.value
)
});
require
работает на этапе компиляции. Т.е. во время исполнения он уже должен был собрать все вызовы require
и положить их в .js
файл. require
не может быть динамичным, потому что на этапе исполнения его тупо уже нет - он заменён на то, что он возвращает.img
уже сейчас лежат все нужные изображения.require
тебе тут не нужен(и не поможет), просто динамически подставляй пути к ним как в твоём первом варианте.__webpack_public_path__
:root: __webpack_public_path__,
<img :src="root + 'img/' + message.filename" :alt="message.filename"/>