3.父组件和子组件 

<body>
    <div id="app">
        <cpn2></cpn2>
    </div>
    <script src='https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js'></script>
    <script>
        const cpnC1 = Vue.extend({
            template: `
            <div>
                <h5>我是标题</h5>
                <p>我是一个段落我是一个段落</p>
            </div>
            `
        });

        const cpnC2 = Vue.extend({
            template: `
            <div>
            <h1>恭喜发财</h1>
            <p>红包拿来 万事如意</p>
            <p>lalallalalallala</p>
        <cpn1></cpn1>

        </div>
            `,
            components: {
                cpn1: cpnC1,
            }


        })
        const app = new Vue({
            el: '#app',
            data: {

            },
            components: {
                cpn2: cpnC2,
            }
        })
    </script>
</body>

 

posted @ 2020-12-29 16:01  闭上耳朵  阅读(142)  评论(0)  编辑  收藏  举报