vue2和vue3各个版本项目结构和启动

createh52个月前 (02-01)技术教程11

vue2版本项目:uniapp微信小程序启动需要下载hbuilder和微信小程序工具。导入ruoyi-uniapp-master项目即可启动项目。ruoyi-ui是vue2版本前端代码,其他项目是后台代码。mysql数据库联系我们获取最新数据库。

vue3版本项目:ruoyi-ui-vue3是前端代码,大家导入就可以启动了。

以上是帮助小伙伴解决问题记录,大家遇到类似问题可以直接参考。希望相互理解、相互包容、共同努力服务客户。

Vue 2 和 Vue 3的区别

1.双向数据绑定原理不同

Vue2 的双向数据绑定是利用ES5的一个APIObject.definePropert() 对数据进行劫持,结合发布订阅模式的方式来实现的。

Vue3 中使用ES6的Proxy API对数据代理。

Vue3 使用数据代理的优势有以下几点:1)definePropert 只能监听某个属性,不能对整个对象进行监听 2)可以省去for in,闭包等内容来提升效率(直接绑定整个对象即可)3)可以监听数组,不用再单独的对数组做特异性操作,Vue3可以检测到数组内部数据的变化

2.是否支持碎片

Vue2 不支持碎片。Vue3 支持碎片,就是说可以拥有多个根节点

3.API 类型不同

Vue2 使用选项类型api,选项型api 在代码里分割了不同的属性:data,computed,method等。

Vue3 使用合成型api,新的合成型api 能让我们使用方法来分割,相比于旧的api 使用属性来分组,这样代码会更加简便和整洁。

4定义数据变量和方法不同

Vue2是把数据放到了data 中,在 Vue2中 定义数据变量是data(){},创建的方法要在method:{}

Vue3 就需要使用一个新的setup()方法,此方法在组件初始化构造的时候触发。使用以下三个步骤来建立反应性数据:1)从vue 引入 reactive;2)使用 reactive ()方法来声明数据为响应性数据;3) 使用setup()方法来返回我们的响应性数据,从而template 可以获取这些响应性数据。

相关文章

一些可以显著提高大型 Java 项目启动速度的尝试

我们线上的业务 jar 包基本上普遍比较庞大,动不动一个 jar 包上百 M,启动时间在分钟级,拖慢了我们在故障时快速扩容的响应。于是做了一些分析,看看 Java 程序启动慢到底慢在哪里,如何去优化,...

有了它、就可以开始做一个简单的Java项目了

今天是刘小爱自学Java的第98天。感谢你的观看,谢谢你。话不多说,开始今天的学习:经过97天的学习,对于JavaSE、数据库以及前端的基本知识,都有了一个大致的了解。在有了这些基础后,就可以开始做J...

神器!一键生成Spring Boot +Vue项目,接私活能缩短一半工期

今天给大家推荐一款自己公司正在打磨的一款一键部署,一键生成全自动化的低代码生成器工具,可以实现前端可视化操作(拖拽形式+配置就可以生成前端页面),后端直接结合前端代码一键生成,数据库(含表字段)可一键...

公司使用了6年的Spring Boot项目部署方案 打包 + 一键部署,稳得一批

云服务器我们需要一台云服务器,我之前白嫖过一台丐版的,1 核1G 内存,并且已经安装了宝塔面板。这是从宝塔面板首页看到的服务器配置详情。MySQL登录宝塔面板,点击「数据库」→「添加数据库」,填写数据...

Java实战项目教程:《锋迷商城》项目实战课程500集大戏杀青

威哥昨天的倾盆大雨仿佛在洗刷心灵的创伤是的没有人可以理解 自己心中的痛苦任何人都不是别人的蛔虫错过了金三银四生活还是依旧没有改变我不想再错过金九银十于是乎 我作了一个艰难的决定亲爱的涛哥我要给你生猴子...

两款开源的中文OCR工具,简直碉堡了

1.cnocrcnocr是用来做中文OCR的Python 3包。cnocr自带了训练好的识别模型,安装后即可直接使用。cnocr主要针对的是排版简单的印刷体文字图片,如截图图片,扫描件等。cnocr目...