美文网首页
Vue组件Component

Vue组件Component

作者: 大孩子气 | 来源:发表于2018-02-06 17:40 被阅读0次

一丶全局化注册组件

<body>
  <div id="app">
  <dx></dx>
  </div>
</body>
<script>
  Vue.component('dx',{
    template:`<div>全局注册组件</div>`
  })
  var app =new Vue({
    el:'#app',
    data:{
    }
  })
</script>

我们在javascript里注册了一个组件,在HTML中调用了他。这就是最简单的一个组件的编写方法,并且它可以放到多个构造器的作用域里

二丶局部注册组件

<body>
  <div id="app">
  <dxx></dxx>
  </div>
</body>
<script>
  var app =new Vue({
    el:'#app',
    components:{
      "dxx":{
        template:`<div>局部组件</div>`
      }
    }
  })

从代码中你可以看出局部注册其实就是写在构造器里,但是你需要注意的是,构造器里的components 是加s的,而全局注册是不加s的

三丶Component标签

相关文章

网友评论

      本文标题:Vue组件Component

      本文链接:https://www.haomeiwen.com/subject/txnwzxtx.html