前端小云儿
活到老学到老
展开
-
vue3中watch详细用法
点我sum+1原创 2024-06-14 14:00:29 · 32 阅读 · 0 评论 -
vue3 修改element-plus主题颜色(官方版)
这种方式只能自定义一种引入,不能点击切换,上面的css版可以点击切换多个。原创 2024-06-13 10:48:15 · 166 阅读 · 0 评论 -
vue3 修改element-plus主题颜色(css版)
上面的是js修改。原创 2024-06-13 10:41:53 · 341 阅读 · 0 评论 -
javascript 深拷贝的三种方法
【代码】javascript 深拷贝的三种方法。原创 2024-03-26 13:44:29 · 40 阅读 · 0 评论 -
vue3+ts 父子组件传值(默认值),子传父
【代码】vue3+ts 父子组件传值(默认值),子传父。原创 2024-03-22 16:00:30 · 365 阅读 · 0 评论 -
vue3 使用Suspense,实验性功能
1 子组件使用的await 可以直接写异步请求 顶层的setup是有async生命的。2 父组件不加Suspense 数据出不来,因为异步请求不到数据。3 需要加Suspense包裹 内部是一个slot插槽。原创 2024-03-19 22:48:33 · 100 阅读 · 0 评论 -
vue3 teleport传送门使用
使用teleport传送门 可以把节点传送到任意dom节点处。写一个谈框 定位为整个浏览器视图窗口。加了滤镜 右边的布局就乱了。原创 2024-03-19 22:24:05 · 51 阅读 · 0 评论 -
vue3 自定义ref创建,使用customRef,输入防抖
自定义响应式数据,可以做延迟。原创 2024-03-19 22:12:12 · 610 阅读 · 0 评论 -
vue3 toRaw和markRaw使用原理教程
应用场景,mock数据,data获取的table数据列表。不需要改变 也不允许改变。原创 2024-03-19 17:36:03 · 218 阅读 · 0 评论 -
vue3 readonly和shallowReadonly 应用
只保证第一层次不能被修改 深层次的数据依旧会被修改下面的age是可以修改的id: '1',data:{age:12})原创 2024-03-19 17:15:18 · 20 阅读 · 0 评论 -
vue3 事件对象和自定义事件实现传值
子组件原创 2024-03-19 14:12:41 · 218 阅读 · 0 评论 -
pinia选项式api和组合式写法(5)
【代码】pinia选项式api和组合式写法(5)原创 2024-03-19 13:46:43 · 194 阅读 · 0 评论 -
pinia数据解构写法的两种写法storeToRefs(3)
2 使用 storeToRefs,只会把state中的数据变成响应式,这样会把它里面的所有数据,方法 都变成响应式,代价比较大。1 pinia数据结构写法 使用toRefs。原创 2024-03-18 22:36:40 · 282 阅读 · 0 评论 -
vue3,vue3 实现前端下载 xlsx;file-saver
主要是将el-table的数据或者数组其他形式的数据下载为excel文件。原创 2024-03-18 17:13:52 · 463 阅读 · 0 评论 -
vue3 路由的用法
import {import {history: createWebHashHistory(),//1定义路由模式//2 添加滚动行为,切换页面 滚动到顶部位置return {left: 0,top: 0})原创 2024-03-16 12:48:10 · 74 阅读 · 0 评论 -
vue3 标签的ref属性 获取值,修改样式
【代码】vue3 标签的ref属性 获取值,修改样式。原创 2024-03-14 14:43:06 · 843 阅读 · 0 评论 -
vue3 watchEffect全自动监听,会立即执行
【代码】vue3 watchEffect全自动监听,会立即执行。原创 2024-03-14 14:31:56 · 104 阅读 · 0 评论 -
vue3 watch的五种详细用法
watch 监听ref定义的【对象类型】数据</div><h3></h3><div>姓名:{{ person.name }}</div><div>年龄:{{ person.age }}</div><div><el-button @click="clickname">点击修改name</el-button></div><div><el-button @click="clickage">点击修改age</el-button>原创 2024-03-14 14:20:15 · 465 阅读 · 0 评论 -
vue3 computed计算属性,也是一个响应式ref数据
【代码】vue3 computed计算属性,也是一个响应式ref数据。原创 2024-03-14 10:37:45 · 346 阅读 · 0 评论 -
如何在vue3的项目中写name 注册文件名
一般情况下 name是和文件名保持一致的。原创 2024-03-13 14:25:17 · 121 阅读 · 0 评论 -
vue3 数据大屏处理1(vh-vm-rem)2(scale)数据大屏适配
1 使用vh和vm 需要计算。2使用scale缩放 原理。原创 2024-03-13 10:24:35 · 126 阅读 · 0 评论 -
vue3 修改element-plus主题颜色(js版)
按文档中设置大部分颜色也会根据设置的颜色改变,但是有部分颜色不生效,比如按钮hover时的颜色还是默认的颜色。这是因为主题色由以下图片的颜色决定的,要修改下面所有的颜色才行。原创 2024-03-10 21:40:55 · 419 阅读 · 0 评论 -
vue3 开启暗黑模式
【代码】vue3 开启暗黑模式。原创 2024-03-10 21:18:57 · 285 阅读 · 0 评论 -
vue3 Element Plus Dialog中的input无法获取表单焦点,需要使用两次nextTick()!!!父组件调用子组件自动获取焦点,无法实现!!!
第一个nextTick是加载对话框,第二个是加载input的form表单。父组件调用子组件自动获取焦点,无法实现。结果不管用 需要调用两次。原创 2024-03-04 17:21:41 · 199 阅读 · 1 评论 -
vue3 后台管理 nprogress进度条使用
在router.beforeEach中加NProgress.start()在router.afterEach中加NProgress.end()3 在main.js引入。原创 2024-02-28 10:30:43 · 315 阅读 · 0 评论 -
vue3 面包屑路由页签写法
路由写法 router.js。main.js引入使用。原创 2024-02-28 09:58:29 · 197 阅读 · 0 评论 -
vue3 电脑全屏设置
【代码】vue3 电脑全屏设置。原创 2024-02-27 18:31:31 · 100 阅读 · 0 评论 -
vue3 el-menu菜单点击展开收缩isCollapse
3 第二步对应的父组件 设置。原创 2024-02-26 10:50:59 · 265 阅读 · 1 评论 -
vue3 element ui el-table分页多选功能
【代码】vue3 element ui el-table分页多选功能。原创 2024-02-26 10:24:39 · 215 阅读 · 0 评论 -
vue3 使用element-ui的el-menu刷新之后保持选中状态
3、点击链接是可以完美做到刷新后会保持选中状态,但是当我们手动输入路由的时候,页面会跳转但是css样式不会改变。当输入的路由和当前的路由不一样的时候。把当前的路由赋值给activeIndex。mounted函数中把这个当前路径赋值给 activeIndex 即赋值给了 default-active 参数。第一次访问的时候sessionStorage是空的,所以要加入默认的路径。官网示例给出的是2个参数key和keyPath,分别打印出来后是一样的都是当前的路径。原创 2024-02-26 10:22:25 · 749 阅读 · 2 评论 -
VUE3 form表单校验,自定义校验
【代码】VUE3 form表单校验,自定义校验。原创 2024-02-17 14:06:25 · 312 阅读 · 0 评论 -
vue3 统一接口api二次封装
1 新建文件api 下面建几个js 用于放不同的项目接口。先看上一篇文章,二次封装。原创 2024-02-16 19:16:40 · 114 阅读 · 0 评论 -
vue3 axios二次封装(js,ts两个版本)
可以在请求拦截器中处理一些业务(开始进度条、请求头携带公共参数)结束、简化服务器返回的数据、处理http网络错误)使用响应拦截器,可以在响应拦截器中处理一些业务(2 新建一个文件夹。原创 2024-02-16 18:38:14 · 780 阅读 · 0 评论 -
vue3 Mock 数据使用
4 在根目录创建mock:去创建我们需要mock数据与接口!根目录下创建 在mock文件夹内部创建一个user.ts文件。3 在 vite.config.js 配置文件启用插件。只看 viteMockServe相关的。5 安装接口插件 axios。在main.js中使用。或者使用npm都可以。原创 2024-02-16 13:03:35 · 159 阅读 · 0 评论 -
vue3 项目集成sass,清除所有默认样式
然后引入到 index.scss。新建一个reset.scss。然后在引入 最下面css部分。最后,在main.js引入。3 清除所有默认项目样式。原创 2024-02-16 11:30:27 · 322 阅读 · 1 评论 -
VUE3 注册全局组件
新建一个index.js。原创 2024-02-16 10:57:17 · 102 阅读 · 0 评论 -
vue3 vue+vite+ts 环境变量配置
不同阶段请求的状态(如接口地址等)不尽相同,若手动切换接口地址是相当繁琐且易出错的。于是环境变量配置的需求就应运而生,我们只需做简单的配置,把环境状态切换的工作交给代码。顾名思义,开发使用的环境,每位开发人员在自己的dev分支上干活,开发到一定程度,同事会合并代码,进行联调。生产环境是指正式提供对外服务的,一般会关掉错误报告,打开错误日志。项目开发过程中,至少会经历开发环境、测试环境和生产环境(即正式环境)三个阶段。测试同事干活的环境啦,一般会由测试同事自己来部署,然后在此环境进行测试。原创 2024-02-15 13:07:00 · 362 阅读 · 0 评论 -
Vue3src 路径别名`@`的配置vite.config.ts,tsconfig.json
这个有好几种写法都可以实现配置,下面可以看看这些写法。原创 2024-02-15 12:40:29 · 386 阅读 · 0 评论 -
vue3 配置强制使用pnpm包管理器工具,防止下载依赖版本不一致
团队开发项目的时候,需要统一包管理器工具,因为不同包管理器工具下载同一个依赖,可能版本不一样,导致项目出现bug问题,因此包管理器工具需要统一管理。package.json中配置启动命令。文件,添加下面的内容。原创 2024-02-15 11:36:33 · 613 阅读 · 0 评论 -
vue3 项目启动,自动打开浏览器“dev“: “vite --open“,
在package.json中添加 --open。原创 2024-02-15 11:29:51 · 101 阅读 · 0 评论