Пытался разными способами <...> что то явно не так
v-model="$store.state.registrations.user_email"
user_email: {
get() {
return this.$store.state.registrations.user_email;
},
set(val) {
this.$store.commit('update_user_email', val);
},
},
v-model
всегда будет разный
{ имя_свойства: значение }
и с помощью Object.assign
закидывать его в объект в стейте - так за один вызов мутации можно будет обновлять несколько свойств). Я так понял, вы предлагаете код, который находится в функции setMarkers() перенести в initializeYandexMap(), я прав?
Элемент - представленный в примере - это FileInput (кликать нужно на него, что бы вызвать диалог выбора файлов)
computed: {
groupedPosts() {
return this.posts.reduce((acc, n) => {
(acc[n.category] = acc[n.category] || []).push(n);
return acc;
}, {});
},
},
При нажатии на название категории хочу выводить посты и соответствующего массива.
categories() {
return Object.keys(this.groupedPosts);
},
data: () => ({
activeCategory: null,
...
<button
v-for="n in categories"
v-text="n"
:class="{ active: n === activeCategory }"
@click="activeCategory = n"
></button>
<div v-if="activeCategory">
<div v-for="n in groupedPosts[activeCategory]" class="post">
...
data: () => ({
items: [...Array(5).keys()],
}),
methods: {
move(index, step) {
const items = [...this.items];
const newIndex = Math.min(items.length - 1, Math.max(0, index + step));
[ items[index], items[newIndex] ] = [ items[newIndex], items[index] ];
this.items = items;
},
// или
move(index, step) {
const { items } = this;
const newIndex = Math.min(items.length - 1, Math.max(0, index + step));
items.splice(index, 1, items.splice(newIndex, 1, items[index])[0]);
},
// или
move(index, step) {
const newIndex = Math.min(this.items.length - 1, Math.max(0, index + step));
if (index !== newIndex) {
const val = this.items[index];
this.$set(this.items, index, this.items[newIndex]);
this.$set(this.items, newIndex, val);
}
},
},
<div v-for="(n, i) in items">
<input v-model="items[i]">
<button @click="move(i, -1)">вверх</button>
<button @click="move(i, +1)">вниз</button>
</div>
не получается обратиться к геттеру <...> показывает null, хотя если вызвать store.getters, то данные есть
<компонент v-if="$store.getters.profile" />
//Подключаю хранилище import store from './store'; store.dispatch('getUser'); new Vue({ el: '#app', router: router, components:{ 'head-app':headImplant, 'footer-app':footer, 'sidebar-app': sidebar } });
new Vue({
store,
...
v-if="accounts"
и v-if="transactions"
тем блокам, внутри которых рендерятся элементы на основе соответствующих свойств. this.steppers[index]=this.steppers[index]+this.step_go
this.$set(this.steppers, index, this.steppers[index] + this.step_go)
<canvas ref="canvas"></canvas>
data: () => ({
ctx: null,
}),
mounted() {
this.ctx = this.$refs.canvas.getContext('2d');
},
methods: {
updateCanvas() {
const { ctx } = this;
...
пробросить метод компонента Menu в качестве параметра компоненту Button
Vue.directive('emoji', (el, binding) => el.innerHTML = emoji(binding.value));
<div class="conversation_name" v-emoji="chatName"></div>
<div
v-for="item in items"
class="col-md-3 services-item"
:class="{ hoverClass: item.hover }"
>
<img :src="item.scr" alt="">
<h3 class="my_services_title">Тест</h3>
<button
class="btn-price"
@mouseenter="item.hover = true"
@mouseleave="item.hover = false"
>Нажать</button>
</div>
data: {
items: [
{
src: 'img/laptop.png',
hover: false,
},
{
src: 'img/laptop.png',
hover: false,
},
],
},