vue中组件的创建

最新推荐文章于 2023-06-02 15:58:14 发布

南南合作

最新推荐文章于 2023-06-02 15:58:14 发布

阅读量410

点赞数

分类专栏： Vue 文章标签：组件创建

本文链接：https://blog.csdn.net/weixin_42442123/article/details/85172276

版权

本文介绍了在Vue.js中创建组件的三种方式：1. 使用vue.extend结合vue.component，2. 直接使用vue.component，3. 通过template模板创建。详细解析了每种方法的用法和应用场景。

摘要由CSDN通过智能技术生成

三种创建方法：

注意：
1.模板template中只能有一个根节点
2.组件的名字，如果采用驼峰命名的话，如myName,那么在使用的时候只能只用my-name

1.vue.extend结合vue.component创建

<body>  
    <div id="app">
      <index-a></index-a>
    </div>
    <script>
      // Vue.extend()函数会返回一个组件的构造器，它里面包含一个参数，它是一个对象，里面是一些配置项
      // Vue.component()函数会利用Vue.extend()返回的构造器创建一个组件的实例，它有两个参数，一个是组件的名字，另一个组件的构造器
      var Index = Vue.extend({
   
        // 指定组件显示的模板
        template: