одно из вложенных свойств через v-model привязывается к чекбоксу
<...>
при попытке прописать v-if с использованием этого свойства, при его изменении ничего в DOM не меняется
v-model
, при первом изменении состояния чекбокса. А vue, как известно, не может обнаружить добавление свойства объекта. Так что это свойство, чтобы оно стало реактивным, должно изначально присутствовать в объекте, и, раз оно используется для задания состояния чекбоска, то пусть дефолтным значением будет false
.v-model
добавляет отсутствующие свойства как реактивные. [...document.querySelectorAll('.add_list > div')].slice(0, 10).forEach((n, i) => {
setTimeout(() => n.style.opacity = 1, i * 30);
});
Math.floor(Date.now() / 1000);
let time = Math.floor(Date.now() / 1000);
setInterval(() => time = Math.floor(Date.now() / 1000), 1000);
<Product product={this.props.product} />
{this.props.product.map(n => <Product key={n.id} product={n} />)}
{Object.keys(anyIcons).map(type => (
<Category>
<CategoryType>
{type === 'people' && 'PEOPLE'}
{type === 'nature' && 'ANIMALS & NATURE'}
</CategoryType>
{anyIcons[type].map(icon => (
<RedactorEmojiItem data={icon.code}>{icon.title}</RedactorEmojiItem>
))}
</Category>
))}
data: () => ({
activeClass: '',
...
}),
<p :class="activeClass"></p>
data: () => ({
classes: [ 'какой-то класс', 'ещё класс', ... ],
...
}),
<p
v-for="n in classes"
@mouseover="activeClass = n"
@mouseout="activeClass = ''"
>
groupedItems() {
return this.items.reduce((acc, n) => {
for (const k in n) {
acc[k] = acc[k] || {};
acc[k][n[k]] = (acc[k][n[k]] || 0) + 1;
}
return acc;
}, {});
}
<div v-for="(group, groupName) in groupedItems">
<h3>{{ groupName }}:</h3>
<div v-for="(value, key) in group">{{ key }} ({{ value }})</div>
</div>
import MyCalendar from './MyCalendar';
import { MyCalendar } from './MyCalendar';
methods: {
onClick1() {
alert('button1 clicked');
},
onClick2() {
this.$refs.button.click();
},
},
<button @click="onClick1" ref="button">button1: click me</button>
<button @click="onClick2">button2: click button1</button>
JSON.stringify(user, (k, v) => v instanceof Function ? v.toString() : v)
ng-controller="plantCtrl"
.