【Vue3】 2.2组件化应用的构造

最新推荐文章于 2024-08-20 09:06:10 发布

YL.L

最新推荐文章于 2024-08-20 09:06:10 发布

阅读量221

点赞数

分类专栏： Vue3 文章标签：前端 ui javascript

本文链接：https://blog.csdn.net/louyunlong/article/details/125664984

版权

Vue3 专栏收录该内容

9 篇文章 2 订阅

订阅专栏

我个人觉得VUE的核心就是组件化 Components

在后端程序原来说 include import requery这些都是代码复用的常见的指令，但是在前端领域却很少有。

前端组件化思想的几个阶段

最早的时候HTML有个 iframe标签，也是一种组件化的思想，只是iframe这样的标签，其底层实现仅仅是考虑了开发人员相对省力一些，对于性能优化、网络优化甚至是视觉层面的表现，都没怎么考虑。貌似是到了HTML5被彻底放弃了，
后来就有了XHR, 没记错的话应该是 xml http request 的意思，而盛极一时的Jquery 这个框架，就是很好的利用了xhr，片段式的加载HTML，并对dom进行控制，这一点于VUE其表现上没有什么不同。Vue早起的时候，于jquery的争论在网上也是非常多的，时至今日，还是有很多Jquery的拥趸。我也算其一。JQuery但是的两大杀手锏，其一就是很好的封装了XHR，用起来很简单，其二就是把DOM操作做了很好的封装和兼容性的处理，但是对于项目的管理，数据的复用、代码的复用等等，全部要依赖开发者自己的经验。性能和成本方面相较于iframe简直就是云泥之别。也因此推动了WEB2.0世代的到来。
到了现在的Vue 基本就是平替了JQuery的DOM操作这一行为，尽管底层实现的基础完全不是一会儿事，按时就普通用的观感来说，如果不考虑加载延迟啥的，客户端性能消耗之类的，那么他们其实真的没啥区别。Vue之所以火的另外一个原因，其实是给前端程序员带来一种系统化的思维。可以称前端为开发、前端为项目、基本是拜Vue所赐。在此之前基于JQuery的前端开发，勉强也能算是个前端开发，但是你要构建一个前端项目，这种概念描述是不适用的。尽管彼时 WebPack react等等的概念已经流行起来，但是当时的前端程序员还鲜有能够接触到。为什么呢？JQuery已经能够满足所有应用的场景了。

前端人员发展的几个阶段

最早的前端人员被称为“网页设计师”
网页设计师都会干 HTML+CSS，然后再细分两个倾向注重 PS 注重JS 都会
注重PS的人分为两个注重视觉效果的进化为 UI设计师 UE设计师，注重页面逻辑、功能排布的进化为产品经理
注重JS的人方向只有一个，但是分了不同的层级
初级网上翻各种脚本库，收集各种脚本，改改变量直接用，这种后来基本都转行做产品经理之类的
中级能读懂网上的脚本，JS红宝书也读过一些，懂的一些JS的基础，能够写一些原生的JS脚本实现自己的目的
高级对那个年代浏览器的兼容性深恶痛绝，于是学会了使用JQuery，能够学会JQuery的，在管理自己的项目时，通常是能够科学规划文件复用，代码复用的。因此这部分人里相当一部分人，就停留在了JQuery的阶段，因为完全够用，可以实现网页端所有的需求。费不费劲另说。只是说能不能。
超级还有一部分人，掌握了JQuery，但是也没有止步不前，随着Vue的兴起，很快也加入到了Vue的生态圈中，Vue的好处就是生态圈，包括后来的这UI库，也基本是基于Vue的组件思想开发的。这些人，通过Vue让自己的开发效率快速提升，其产出效率不是一个JQuery能比拟的。但是有一点，通常从JQuery那个年代开发到现在的前端程序员，通常是积累自己的很多轮子，真的搞起项目来，并不一定比新人Vue慢。

后来

就是新时代了，开门就是完整的前端程序员概念。时代发展的脚步不可阻挡。

代码

写这么多废话的原因，是因为在 SFC中使用 Component 非常简单

<script setup lang='ts'>
import MyComponentVue from '@/components/MyComponent.vue'
</script>

<template>
<my-component-vue></my-component-vue>
<MyComponentVue></MyComponentVue>
</template>

上述代码，在Script标签对中引入了一个自定义的Component,然后在Template标签对中放置了这个Component对象两次。