VUE 自定义组件定义和基本使用

我们是不是经常听到Vue组件化开发,今天让我们来看看怎么组件定义的方式和基本使用吧

一、初始化项目

    1.创建文件夹,初始化环境自动生成package.json 文件

npm init -y

     2.导入VUE依赖

npm i vue

     如下图就引入成功啦

 二、组件注册

      1.全局注册组件


    

运行效果的

 

PS:需要注意的一个小细节  

 1.Vue.component('my-button', {...})  组件名可以定义为my-button 和myButton 在div中是用,定义成mybutton在div中引用报错,这个是遵循 W3C 规范中的自定义组件名 (字母全小写且必须包含一个连字符)。这会帮助你避免和当前以及未来的HTML 元素   相冲突。

  2.每个都是独立的互不影响,相当于每次使用都会在内存中开辟一个新的地址指向

  2.局部注册组件


    

  运行效果的

VUE 自定义组件定义和基本使用_第1张图片

 

你可能感兴趣的:(VUE学习)