Vue监听子组件事件

首先看下面的示例代码：
注意：

在vue中，对于绑定的style属性，样式内容不能用-的写法，比如font-size，是无效的，而应该写成驼峰的形式fontSize.

<div id="app">
    <div :style="{
      fontSize: postFontSize + 'em'}">
        <blog-post v-for="post in posts" :key="post.id" :post="post"></blog-post>
    </div>
</div>

Vue.component("blog-post", {
   
    props: ['post'],
    template: `
        <div class="blog-post">
            <h3>{
    { post.title }}</h3>
            <button>
                Enlarge Text
            </button>
            <div v-html="post.content"></div>
        </div>
    `
});
let vm = new Vue({
   
    el: "#app",
    data: {
   
        posts: [
            {
    id: 1, title: 'My journey with Vue' },
            {
    id: 2, title: 'Blogging with Vue' },
            {
    id: 3, title: 'Why Vue is so fun' }
        ],
        postFontSize: 1
    }
}