自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(16)
  • 收藏
  • 关注

原创 什么才是完美的表格二次封装elementPlus表格?-从零开始vue3+vite+ts+pinia+router4后台管理(7)

ElementPlus 是一个优秀的组件库,后台管理表格页面多的话大家都想到表格的二次封装,封装的时候大家都想到 每一列写成 “ 数组” 写法。然后用vue3的去写一些自定义的东西,如下面的例子“ 数组” 封装的缺点有上面的代码可以看出 el-table-column虽然少写了,但是json数组的代码并没有少写,上面的自定义列其实在ElementPlus上面直接写的话也就几行代码我们尤其是复杂的管理页面 自定义的列也会越来越复杂,后面我们的代码也会越来越难维护,那么应该怎么办呢?我的想法下面是我封装二

2023-11-16 16:36:52 825

原创 Vue3进阶<5>vue3中的$attrs的使用

attrs$attrs 对象包含了除组件所声明的 props 和 emits 之外的所有其他 attribute,例如 class,style,v-on 监听器等等。

2023-11-14 13:31:02 5594

原创 JavaScript开发者应懂的33个概念<9>-map, reduce, filter 等高阶函数

记录一个重新学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里。

2023-11-07 15:38:26 86

原创 JavaScript开发者应懂的33个概念<8>-闭包

记录一个重新学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里。

2023-11-07 14:37:44 56

原创 JavaScript开发者应懂的33个概念<7>-函数作用域, 块级作用域和词法作用域

记录一个重新学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里。

2023-11-07 11:54:01 40

原创 JavaScript开发者应懂的33个概念6-this, call, apply 和 bind

记录一个重新学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里。

2023-11-06 17:44:37 33

原创 JavaScript开发者应懂的33个概念25-工厂函数和类

记录一个重新学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里本篇文章分为四个部分工厂函数和构造函数的区别ES6的类。

2023-11-04 18:19:59 38

原创 JavaScript开发者应懂的33个概念26-设计模式

记录一个重新学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里。

2023-11-03 15:28:14 38

原创 JavaScript开发者应懂的33个概念12-Promise,async 与 wait

记录一个学习javascript的过程 ,文章并不是按顺序写的,写完就会更新目录链接 本篇文章目录是参照 @leonardomso 创立,英文版项目地址在这里本篇文章分为四个部分promise的介绍和使用手写promise面试题和项目中使用promiseasync 与 wait1.1介绍Promise对象表示异步操作最终的完成(或失败)以及其结果值, 一个 Promise是一个代理,它代表一个在创建 promise 时不一定已知的值。

2023-11-02 16:20:31 95

原创 Vue3中slot插槽的使用

1.修改一下child.vue代码:< template > < div class = " child-con " > < p > 我是子组件2 < slot > < p > 我是默认内容

2023-10-09 16:20:29 168

原创 从零开始vue3+vite+ts+pinia+router4后台管理(4)-导航标签栏和keep-alive缓存

这样inclue 我们获取的cachedViews 路由的name和组件name一样 的话页面就会被缓存 如下图,切换页面的时候输入框的值并没有改变。上面的写法在 vue2 中是可以的,但是在 vue3 中需要将 keep-alive 写在 router-view 中才行,我们修改一下写法。,vue3我们用setup 语法的时候没有export default 那我们的name定义在什么地方呢 这里我们需要一个插件。1.我们缓存的是页面的main部分 header和侧边栏是不缓存的 ,vue2 的写法。

2023-10-07 18:28:22 306

原创 从零开始vue3+vite+ts+pinia+router4后台管理(3)-动态路由

函数,允许你从路径中解析文件。比如后端返回的是oder/orderList 路由 需要前端匹配 你需要在views文件夹 新建一个order文件夹 然后文件夹新建一个orderList.vue。当然 如果你用的是vue2 vueCli构建的vue项目 你可以用 require引入 import.meta.glob只适用于Vite。),然后前端根据获取的路由数组动态加载路由,今天我们就看看怎么样实现的吧!init为true说明已经获取过路由,就直接放行,init为false则向后台请求用户路由。

2023-10-07 11:36:02 736

原创 从零开始vue3+vite+ts+pinia+router4后台管理(2)-页面布局

在store文件夹下面创造一个settings.ts来控制一些全局的设置,layoutMode就是控制布局变量的参数。第二中可以让表格铺满屏幕 展示更多的数据 ,但是两种到想要怎么办?切换页面布局的时候改变settingsStore.layoutMode值就行。用is来实现动态组件 来实现我们后台页面布局切换。1.限制元素 ,下面是官网的解释。页面布局用is实现动态组件。常见的页面布局有两种。

2023-10-07 10:48:59 333

原创 vue源码(1)一文读懂vue2和vue3的双向绑定原理

引入的一个新特性,它允许你创建一个代理对象,用于拦截对目标对象的访问。通过使用Proxy,你可以拦截目标对象上的各种操作,比如属性访问、属性赋值、函数调用等,并在这些操作发生时执行自定义的逻辑。//Object.defineProperty它可以用来给一个对象定义一个属性或者修改一个现有的属性,并且返回这个对象。//configurable 为 true 时,该属性描述符才能够被改变,同时该属性也能从对应的对象上被删除。也就是说数据和视图同步,数据发生变化,视图跟着变化,视图变化,数据也随之发生改变。

2023-10-06 16:13:24 198

原创 从零开始vue3+vite+ts+pinia+router4后台管理(1)

公司上半年重构了后台管理页面,用了,想记录一下一个公司后台管理项目从零到开始的过程# 克隆项目 gitee地址# 进入项目目录# 安装依赖# 本地开发 启动项目。

2023-10-06 11:38:43 217

原创 Vue Router4 vue3 根据后端返回的路由数组动态匹配挂载路由

我们在做项目中经常遇到有后端返回的文件路径(比如order/orderList),然后前端根据获取的路由数组动态加载路由,今天我们就看看怎么样实现的吧!本项目vue版本vue3 vue-router4 pinia Vite 完成的

2023-09-28 14:45:52 769 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除