初学vue,照着官网实例敲的,怎么点击按钮字体没有变大啊
Html代码:
<body><div id="blog-posts-events-demo"> <div :style="{ fontSize: postFontSize + 'em' }"> <blog-post v-for="post in posts" v-bind:key="post.id" v-bind:post="post" ></blog-post> </div></div></body>
js代码
Vue.component('blog-post', { props: ['post'], template: ` <div class="blog-post" v-on:enlarge-text="postFontSize+=0.1"> <h3>{{ post.title }}</h3> <button v-on:click="$emit('enlarge-text')"> Enlarge text </button> <div v-html="post.content"></div> </div>` }) let a = new Vue({ el: '#blog-posts-events-demo', data: { posts: [ {id: 1, content: 'My journey with Vue', title: '1'}, {id: 2, content: 'Blogging with Vue', title: '2'}, {id: 3, content: 'Why Vue is so fun', title: '3'} ], postFontSize: 1 } })
相关分类