首页 > web前端 > js教程 > Vue.js中组件的创建与注册方法的介绍

Vue.js中组件的创建与注册方法的介绍

不言
发布: 2018-08-23 16:00:55
原创
2069 人浏览过

本篇文章给大家带来的内容是关于Vue.js中组件的创建与注册方法的介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

使用之前要创建

在 components 文件下创建一个自己的 组件文件(.vue)

初始结构为

<!--html区域-->
<template>
    
</template>

<!--JS区域-->
<script>
    export default {
        name: "hw"
    }
</script>

<!--css区域-->
<style scoped>

</style>
登录后复制

加入自己的代码设置就完成了一个简单的 子组件文件 创建

<!--html区域-->
<template>
    <p class="hw">
      {{ name }}
    </p>
</template>

<!--JS区域-->
<script>
    export default {
        name: "hw",
      data(){
          return {
            name:"毛没齐"
        }
      }
    }
</script>

<!--css区域-->
<style scoped>
.hw{
  color: blue;
}
</style>
登录后复制

子组件创建好后 就要注册它,只有注册了才能使用

注册分为 

                1.局部注册组件 :在App.vue文件中注册   也在App.vue文件使用
               

                2.全局注册组件:在main.js文件中注册

全局注册组件后,在 App.vue文件使用

 相关推荐:

 使用 Vue.js 创建的 Calendar_html/css_WEB-ITnose

 什么是Vue.js组件?Vue.js组件用法汇总

以上是Vue.js中组件的创建与注册方法的介绍的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板