vue编程项目(vue项目如何部署)

2023-11-23 06:06:11 数码极客 bianji01

 

前端中的Vue是什么?

什么是vue?Vue.js是一套构建用户界面的渐进式框架,Vue采用自下向上增量开发的设计,其核心库只关注视图层,易于上手,同时vue完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。其实抛开官方的一些不知所云的说法,简单来说,在传统web开发中,我们搭建项目都以html结构为基础,然后通过jquery或者js来添加各种特效功能,需要去选中每一个元素进行命令,这些内容在简单的项目中或者不变的项目中还能应付得来,一旦项目改动或者项目工程较大,代码的修改将是复杂繁琐的,而这时候用了vue,这些问题都不复存在。在比如一些单网页制作成的应用程序,一般涉及到数据交互的内容都很多,而应用了vue之后将大大缩减工作量。

如果你想要学好web前端最好加入一个好的学习环境,可以来这个Q群,首先是132,中间是667,最后是127,这样大家学习的话就比较方便,还能够共同交流和分享资料

vue在web开发,网站制作中有哪些显著优势?1.数据绑定:vue会根据对应的元素,进行设置元素数据,通过输入框,以及get获取数据等多种方式进行数据的实时绑定,进行网页及应用的数据渲染。2.组件式开发:通过vue的模块封装,它可以将一个web开发中设计的各种模块进行拆分,变成单独的组件,然后通过数据绑定,调用对应模版组件,同时传入参数,即可完成对整个项目的开发。

基于 Vue3 和 TypeScript 项目大量实践后的思考

Vue3出来已经有一段时间了,在团队中,也进行了大量的业务实践,也有了一些自己的思考。总的来说,Vue3无论是在底层的原理上,还是在业务的实际开发中,都有了长足的进步。使用 proxy 代替之前的 Object.defineProperty 的API,性能更加优异,也解决了之前vue在处理对象、数组上的缺陷;在diff算法上,使用了静态标记的方式,大大提升了Vue的执行效率。在使用的层面,我们从options Api,变成了composition Api,慢慢的在实际的业务中,我们抛弃了原本的data、methods、computed那种隔离式的写法。compositon Api,它更加聚焦,它讲究的是相关业务的聚合性。完全良好的支持了TypeScript,类型校验也成为了以后Vue3进行大型项目开发的质量保障,同时这也是面向了趋势 -- 前端的未来就是TypeScript!compositon Api的本质,体现在代码里面,也就是一个setup函数,在这个setup函数中,返回的数据,会用到该组件的模板中。return的这个对象,一定程度上,代表了之前vue2中的data属性。这时候,对于大多数初学者来说,可能存在的疑惑就是,那么我能不能定义options Api的写法,比如data、computed、watch、methods等等。这里我需要明确的是,Vue3是完全兼容Vue2的这种options Api的写法,但是从理念上来说,更加推荐setup的方式,来写我们的组件。原因如下:Vue3的存在,本身是为了解决Vue2的问题的,Vue2的问题就是在于,聚合性不足,会导致代码越来越臃肿!setup的方式,能够让data、方法逻辑、依赖关系等聚合在一块,更方便维护。也就是说,以后我们尽量不要写单独的data、computed、watch、methods等等,不是Vue3不支持,而是和Vue3的理念违背。components属性,也就是一个组件的子组件,这个配置在Vue2和3的差异不大,Vue2怎么用,Vue3依然那么用。在功能方面,ref 和 reactive,都是可以实现响应式数据!在语法层面,两个有差异。ref定义的响应式数据需要用[data].value的方式进行更改数据;reactive定义的数据需要[data].[prpoerty]的方式更改数据。但是在应用的层面,还是有差异的,通常来说:单个的普通类型的数据,我们使用ref来定义响应式。表单场景中,描述一个表单的key:value这种对象的场景,使用reactive;在一些场景下,某一个模块的一组数据,通常也使用reactive的方式,定义数据。那么,对象是不是非要使用reactive来定义呢?其实不是的,都可以,根据自己的业务场景,具体问题具体分析!ref他强调的是一个数据的value的更改,reactive强调的是定义的对象的某一个属性的更改。周期函数,在Vue3中,是被单独使用的,使用方式如下:在Vue2中,其实可以直接通过this.$store进行获取,但是在Vue3中,其实没有this这个概念,使用方式如下:在Vue2中,是通过this.$router的方式,进行路由的函数式编程,但是Vue3中,是这么使用的:merchant.ts这一部分内容,准确的来说,是TS的内容,不过它与Vue3项目开发,息息相关,所以真的想用Vue3,我们还是得了解TS的使用。不过这一部分,我不会介绍TS的基础语法,主要是在业务场景中,如何组织TS。在一个常见的接口请求中,我们一般使用TS这么定义一个数据请求,数据请求的req类型,数据请求的res类型。

声明:易趣百科所有作品(图文、音视频)均由用户自行上传分享,仅供网友学习交流。若您的权利被侵害,请联系315127732@qq.com
广告位招租
横幅广告