vue.js实战 第一篇 第七章 组件详解_组件的高级用法

<div id="app">
    <mc :count="1"></mc>
</div>
<script>
    Vue.component(‘mc‘,{
        name:‘mc‘,
        props:{
            count:{
                type:Number,
                default:1
            }
        },
        template:‘        <div class="child">            <mc :count="count+1" v-if="count<3"></mc>        </div>‘
    });
</script>

<div id="app">
    <mc></mc>
    <script type="text/x-template" id="mc">
        <div>text</div>
    </script>
</div>
<script>
    Vue.component(‘mc‘,{
        template:‘#mc‘
    });
</script>

<div id="app">
</div>
<script>
    var mc=Vue.extend({
        template:‘<div>hello{{name}}</div>‘,
        data:function(){
            return{
                name:‘Aresn‘
            }
        }
    });
    new mc().$mount(‘#app‘);
    //或者
    new mc({
        el:‘#app‘
    })
</script>