组件实例

最新推荐文章于 2024-05-08 01:26:03 发布

Lucky总裁大大

最新推荐文章于 2024-05-08 01:26:03 发布

阅读量1.4k

点赞数 4

本文链接：https://blog.csdn.net/m0_46388605/article/details/104505845

版权

组件

1.组件继承自实例实例有的组件也有,会有一些变异
2.组件的目的是为了实现复用

    <body>
     <div id="app">
     //把组件当成标签来使用 组件名不能和便签名一致
        <sbx></sbx>
    </div>
    </body>
    
    //创建组件
    let hehe = Vue.extend({
                template: "<h1>这里是组件</h1>"
            })
    //注册组件
    <!-- 
        Vue.component("组件的名字",创建组件)
     -->
    Vue.component('sbx', hehe)

    let vm = new Vue({
            el: "#app"
        })

全局组件

1.通过Vue.component 注册的组件就叫全局组件
全局组件在所有实例里都能使用

  let hehe = Vue.extend({
                template: "<h1>这里是组件</h1>"
            })
   
       Vue.component('sbx', hehe)

简写:

        Vue.component('xixi', {
            template: "<h1>你好</h1>"
        })

局部组件

1.局部组件和全局组件的创建方式一致注册方式不一样
2.局部组件在哪注册在哪使用
3.局部组件注册在实例的配置项 components里

 <div id="app1">
        {
  {name}}
        <xixi></xixi>
        <hehe></hehe>
    </div>
    <hr />
    <div id="app2">
        {
  {name}}
    </div>

    <script>
        let component = Vue.extend({
            template: "<h1>你好</h1>"
        })
        let vm1 = new

最低0.47元/天解锁文章

Lucky总裁大大

关注

4
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
组件实例

组件1.组件继承自实例实例有的组件也有,会有一些变异2.组件的目的是为了实现复用 <body> <div id="app"> //把组件当成标签来使用组件名不能和便签名一致 <sbx></sbx> </div> </body> //创建组件...
复制链接

扫一扫