{
computed: {
percentTotal() {
return this.users.reduce((acc, user) => acc + user.percent, 0)
},
},
}
<a :href="'http://wwwapps.ups.com/etracking/tracking.cgi?TypeOfInquiryNumber=T&InquiryNumber1=' + pack.track_number + '&commit=Track%21"
import Vue from 'vue';
import VueComponent from './VueComponent.vue';
const element = document.getElementById('element');
new Vue({
el: element,
template: `<vue-component/>`,
components: {
VueComponent,
},
});
<comp :foo.sync="bar" :baz.sync="xyz"></comp>
<comp :foo="bar" @update:foo="val => bar = val" :baz="xyz" @update:baz="val => xyz = val"></comp>
<style lang="scss" type="text/scss">
@import "./styles/app.scss";
</style>
import Meta from 'vue-meta';
Vue.use(Meta);
import HomePage from '../components/pages/Home.vue';
new Router({
routes: [
{
name: 'home',
path: '/',
component: HomePage,
},
});
<script>
export default {
metaInfo: {
title: 'Vue App',
meta: [
{ vmid: 'description', property: 'description', content: 'Vue App' },
{ vmid: 'og:title', property: 'og:title', content: 'Vue App' },
{ vmid: 'og:description', property: 'og:description', content: 'Vue App' },
],
},
};
</script>
Вызывается после того, как виртуальный DOM был обновлён из-за изменения данных.
<button type="button" @click="handler"></button>
handler(e) {
console.log(e.target);
}
<product-item :product="product"></product-item>
props: ['product'],
<div class="row">
<div v-for="user in users" v-bind:class="userClass">></div >
</div >
const vm = new Vue({
el: '#app',
data: {
users: [],
},
computed: {
userClass() {
// ваша логика разделения по колонкам
return this.users.length > 3 ? 'col-sm-4' : 'col-sm-12';
},
},
});