首页 > 技术文章 > 小白学习vue第五天(理解使用组件开发,组件第一弹)

zy-simpleboy 2021-07-21 16:20 原文

组件怎么从创建到使用?

第一步创建组件构造器对象

感觉个人理解就是创建一个模板,和创建MongoDB数据模板相似

const cpnC = Vue.extend({
            template: `
            <div >
        <h1>我是标题</h1>
        <p>我是内容</p>
             </div>`
})

  

第二步注册组件

模板做好了就要注册一下才能用,注册成Vue的组件

Vue.component('my-cpn', cpnC)
        const app = new Vue({
            el: '#app',
            data: {
                message: "你好,世界",

            },

        })

  

第三步使用组件

<div id="app">
        <my-cpn></my-cpn>
        <my-cpn></my-cpn>
        <my-cpn></my-cpn>
</div>

推荐阅读