@click="menuShow=!menuShow,goToBlock"@click="menuShow = !menuShow, goToBlock($event)". Ну а лучше бы конечно сделать новый метод (если goToBlock действительно нужен как отдельный метод, в противном случае достаточно унести в него переключение menuShow), как-то так:methods: {
goToBlock(selector) {
document.querySelector(selector).scrollIntoView({
behavior: 'smooth',
});
},
onMenuItemClick(e) {
this.menuShow = false;
this.goToBlock(e.target.getAttribute('href'));
},
},@click.prevent="onMenuItemClick"
computed: {
needWatch() {
return Object.fromEntries(Object.entries(this.obj_lev_1).map(n => [ n[0], n[1].need_watch ]));
},
},watch: {
needWatch(newVal, oldVal) {
const [ k, v ] = Object.entries(newVal).find(n => n[1] !== oldVal[n[0]]);
alert(`${k}.need_watch changed from ${oldVal[k]} to ${v}`);
},
},editTask (task, index) {v-model="editidTask.title"task.title = this.editTask.titlethis.tasks.map((task, index) => { if (index === this.editidTask.id) {
mounted() {
const observer = new IntersectionObserver(entries => {
if (entries[0].isIntersecting) {
stopObservation();
// здесь запрашивайте свои данные
}
}, {
threshold: 1,
});
observer.observe(this.$el);
const stopObservation = () => observer.disconnect();
this.$on('hook:beforeDestroy', stopObservation);
},props: [ 'value', 'placeholder' ],<div>
<input
:class="value ? 'input_filled' : ''"
:value="value"
@input="$emit('input', $event.target.value)"
>
<span>{{ placeholder }}</span>
</div>data: () => ({
opened: [],
...
}),
watch: {
opened: {
immediate: true,
handler(val) {
const id = this.treeitems[0].id;
if (!val.includes(id)) {
val.push(id);
}
}
},
...
},:open.sync="opened"
Разбираюсь, как устроен vuejs
в this экземпляр vue
дошел до "v-model изначально равным соответствующему значению из объекта data" и не понимаю как это сделать
<el-form-item v-for="n in formItems">
<el-input v-model="n.value" /><el-form-item v-for="n in formItems">
<el-input v-model="n.obj[n.key]" />true/false, а читаете 'true'/'false'. В куках же строки хранятся. А булевым эквивалентом любой непустой строки является true. Поэтому результат работы v-if/v-show одинаков, вне зависимости от прочитанного значения.
data: () => ({
swiperOptions: {
initialSlide: здесь номер слайда,
},
}),<swiper :options="swiperOptions">
data: () => ({
value: '',
values: [ 'hello, world!!', 'fuck the world', 'fuck everything' ],
}),<input v-model="value">
<button v-for="(n, i) in values" @click="value = n">set value #{{ i + 1 }}</button>data: () => ({
scroll: 0,
}),
computed: {
style() {
return {
height: здесь рассчитываете высоту на основе this.scroll,
};
},
},
created() {
const onScroll = () => this.scroll = document.scrollingElement.scrollTop;
onScroll();
document.addEventListener('scroll', onScroll);
this.$on('hook:beforeDestroy', () => document.removeEventListener('scroll', onScroll));
},<div :style="style">
computed: {
grouped() {
return this.dataTable.reduce((acc, n) => {
(acc[n.customer.name] = acc[n.customer.name] ?? []).push(n);
return acc;
}, {});
},
},<template v-for="(items, customer) in grouped">
<tr>
...
</tr>
<tr v-for="item in items">
...
</tr>
</template>v-for="image in images" должно быть v-for="image in result.images".v-model="profileImg" и {{profileImg}} должно быть v-model="result.profileImg" и {{ result.profileImg }}.name="profileImg" значение name должно вычисляться динамически, в зависимости от result (например - добавляйте id, если есть, или индекс).<li>{{ result.sizes.join(' ') }}</li> должно быть <li v-for="size in result.sizes">{{ size }}</li>.