【Vue3 从入门到实战 进阶式掌握完整知识体系】010-探索组件的理念:组件概述

三、探索组件的理念

1、组件概述

组件图解

组件的概念非常常见,类似于模块的概念

components.png

简单使用





  
  
  
  hello vue
  
  



  

运行结果

image-20210613102847084.png

复用组件





  
  
  
  hello vue
  
  



  

运行结果

image-20210613103227862.png

组件可嵌套使用





  
  
  
  hello vue
  
  



  

运行结果

image-20210613103546500.png

全局组件

当前我们使用 component 进行组件注册是一种全局注册,只要定义了,处处可以使用,性能不高,但使用简单





  
  
  
  hello vue
  
  



  

局部组件

习惯:定义全局组件使用 - 分割(hello-world),定义局部组件使用帕斯卡命名法(HelloWorld)

定义之后,再进行注册才能用,性能高,使用起来有点复杂;





  
  
  
  hello vue
  
  



  

运行结果

image-20210613104559185.png

你可能感兴趣的:(【Vue3 从入门到实战 进阶式掌握完整知识体系】010-探索组件的理念:组件概述)