VUE3
文章平均质量分 73
VUE3
故里2130
共同学习交流,包括C#,uniapp,H5,vue3,小程序,网站,客户端,数据库,后台接口等等,以及疑难的软件问题。
展开
-
在vue3中Element Plus切换主题
一共2种方法。原创 2023-03-06 16:27:36 · 3921 阅读 · 0 评论 -
VUE3中,使用Axios
axios是前后端数据交互的重要桥梁,理论和概念这里不再叙述了。可以看看官网。本例子,从简单到难,从初级使用,到高级封装。1.废话少说,先使用HBuilder X建立一个能运行的项目2.安装axios使用如下命令安装安装成功后3. 建立文件夹和文件,如图所示4.demoAxios.js中的代码,其他的选项可以自己增加5.使用在vue界面中,先导入,然后直接写api地址,其中api已经写好了。HelloWorld.vue代码,其中没用的代码已经删除了6.运行后,效果至此,简单的使用就完成了。原创 2023-01-06 16:15:49 · 8808 阅读 · 0 评论 -
VUE3-生命周期钩子《六》
生命周期的作用,页面加载的时候,主动执行某些程序。生命周期钩子有很多种,每一种都是有顺序的,如果不按照顺序执行的话,那么就不会触发某种效果,所以先要了解生命周期钩子函数的顺序。以下是官网提供的生命周期图示其中说2个主要使用的生命周期钩子,onMounted和onUpdated官网也有其他生命周期钩子介绍。原创 2022-12-27 14:14:15 · 7218 阅读 · 0 评论 -
VUE3-计算属性和监听器《五》
在vue3种,当界面上需要处理一些数据的时候,可以通过计算属性和监听器处理,他们都是对一个属性进行操作的,然后返回数据。他们的区别是,计算属性,是通过一开始的初始值进行计算,或者调用某一个方法后,进行计算返回的值,而监听器,是根据界面的数据的变化而变化的时候,进行监听后计算返回的值。原创 2022-12-25 23:26:56 · 1346 阅读 · 0 评论 -
VUE3中,使用.env.development和.env.production
在实际项目开发过程中,可能开发环境和生产(测试)环境不一样,经常需要修改配置常量,才能满足对应的环境,才能使软件运行起来。6.此时,我这里使用nginx进行发布,当然你也可以使用别的发布网址,比如IIS等等。4.打包后,之前的config.js就没有了,复制所有的打包文件。nginx的配置,之前文档已经介绍了,这里不再说明。5.选择build,生成生产模式,程序就在dist中。1.打包前,在项目的根目录中,创建config.js。部署完成后,直接打开,我这里是808端口。开头,否则无法识别,如图所示。原创 2023-01-05 14:06:49 · 6839 阅读 · 0 评论 -
VUE3-组件之间传值《四》
组件之间的传值,分为3种方式。原创 2022-12-21 16:38:31 · 5021 阅读 · 1 评论 -
VUE3-Pinia的使用《三》
主要用于状态管理,管理全局的变量,也可以存储页面A的值,然后在页面B中直接访问,不分父子组件之间的关系,可以任意传值,非常的灵活。为了持久化缓存,不会因刷新界面而导致数据清空的问题,需要安装pinia-plugin-persistedstate,很多人没有安装,所以会导致刷新后,没有存储上数据。6.此时,我们打开谷歌浏览器,然后按F12,如果安装了vue devtools,选择VUE即可。如果我们刷新界面,counter值自动增加,其他的值,并不会变化,这样其实就成功了。和上面一样,输入命令进行安装。原创 2022-12-21 14:34:42 · 2425 阅读 · 4 评论 -
VUE3-路由《七》
路由就是点击链接或者按钮,进行跳转另一个界面中。在vue中一般使用vue-router来完成路由的操作。4.建立一个文件夹store,再建立一个router.js文件,进行路由配置。为了美观,我们安装element-plus,这里不再演示。其中DemoMain是主界面的代码,也是最关键的。安装完成后,在package.json中可以看到。下面我们进行路由的跳转和嵌套路由的实例操作。1.首先建立一个正常的运行程序。2. 安装vue-router。3.首先我们创建6个vue文件。使用下面的命令,安装路由。原创 2022-12-28 00:37:33 · 1002 阅读 · 4 评论 -
VUE3-模板语法《二》
首先看到这张图,左边的结构就不分析了,上一章有说明顺序。中间红色的部分,分为3块,第一块是模板,里面写html;第二块是脚本语言,里面写js或者ts语言,lang="ts"就是ts语法,setup就是vue3中独有的一份,需要注意写法,否则会报错;第三块是html的样式,scoped只在当前区域有效果。这3块可以任意排列,根据你的习惯而定,既然是模板语法,那么重点就是template里面,在template里面写代码,和html写的代码效果是一样的,只是一种语法糖。原创 2022-12-20 23:01:30 · 702 阅读 · 0 评论 -
VUE3-创建项目《一》
2.了解Node和NPM,node是vue的开发环境,npm是依赖管理包,npm就和Java的maven一样,和c#的NuGet一样,都是管理包的工具。2选1都可以,然后选择市面上的前端开发工具,VScode或者HBuilderX,本文以后选择使用HBuilderX,因为我感觉比较轻量级。3.打包工具,webpack和vue/cli,都是对整个web程序进行打包的,二选一即可,一般使用自带的vue/cli打包。一是:直接引入vue.js文件,就是在官网下载好文件,然后对文件进行引入。原创 2022-12-19 22:36:54 · 782 阅读 · 0 评论