说明 该文章是属于OverallAuth2.0系列文章,每周更新一篇该系列文章(从0到1完成系统开发)。 该系统文章,我会尽量说的非常详细,做到不管新手、老手都能看懂。 说明:OverallAuth2.0 是一个简单、易懂、功能强大的权限+可视化流程管理系统。 友情提醒:本篇文章是属于系列文章,看该 ...
使用 vxe-table 设置斑马线条纹样式,通过设置 stripe 参数,如果是树结构的数据,需要注意是否开启 tree-config.transform 平级结构才能支持;还可以通过 css 变量控制对应的颜色,支持全局或者局部修改颜色值 官网:https://vxetable.cn Gitee ...
vxe-table 树形结构支持多种方式的序号,可以及时带层级的序号,也可以是自增的序号。 官网:https://vxetable.cn 带层级序号 <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div> </templa ...
“ 知行合一 ” —— 王阳明 在开发项目中,我们时常会用到表格,许多需求可能会要求自定义特定的行或列。 接下来,我们将探讨在实际开发中如何应对这一挑战。 本文案例采用的技术: 名称 版本 Vue3 ^3.5.12 element-plus ^2.8.8 知识点 我们先来复习下2个知识点,来自ele ...
title: Nuxt.js 应用中的 render:island 事件钩子 date: 2024/12/1 updated: 2024/12/1 author: cmdragon excerpt: 在 Nuxt.js 中,render:island 钩子允许开发者在构建“岛屿”HTML之前进行处理 ...
vxe-table 可编辑表格使用下拉树 <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div> </template> <script> export default { data () { const regionEd ...
vxe-table 树结构单元格选取与复制粘贴,通过 tree-config.transform 使用树形表格 <template> <div> <vxe-table border show-overflow keep-source height="600" :column-config="colu ...
title: Nuxt.js 应用中的 render:html 事件钩子 date: 2024/11/30 updated: 2024/11/30 author: cmdragon excerpt: 在构建 HTML 内容时,能够对其进行动态修改是非常有用的。render:html 钩子为开发者提供 ...
vxe-table 树形表格的使用,支持多种数据结构,可以是带有父子结构的数组,也可以带有层级结构的嵌套数据。 官网:https://vxetable.cn Gitee 带有父子结构的平级数据 只需要带有父子结构的平级数据,例如:id 和 parentId,字段名可以任意设置。对于保存到数据库的平级 ...
请先点击链接RobinDevNotes,体验用VuePress搭建博客的效果(logo还没有合适的替换),目前部署在GitHub Pages上,国内访问速度还可以,再阅读本文感受来龙去脉和搭建过程。 最近准备自己要写点小项目,当前技术栈是以运维和后端为主,自己要写项目的话还是要会一些前端技术,选择学 ...
写在开头 点赞 + 收藏 学会 前言 老板:新的需求不是上线了嘛,怎么用户看到的还是老的页面呀 窝囊废:让用户刷新一下页面,或者清一下缓存 老板:那我得告诉用户,刷新一下页面,或者清一下缓存,才能看到新的页面呀,感觉用户体验不好啊,不能直接刷新页面嘛? 窝囊废:可以解决(OS ...
在使用 vxe-from 表单时,可能由于绑定项非常多,这个时候可能就需要将表单进行分类分组,可以泰国片页签的当时进行拆分组。 <template> <div> <vxe-tabs v-model="activeTab" height="200"> <vxe-tab-pane title="页签1" ...
title: Nuxt.js 应用中的 render:response 事件钩子 date: 2024/11/29 updated: 2024/11/29 author: cmdragon excerpt: render:response 是一个在 Nuxt.js 中与服务器端渲染(SSR)相关的钩 ...
当需要再表格中的某个字段是关联另外一张表示,需要将从另外表选择数据,并将数据保存在当前行中 官网:https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"> <template #action="{ row }"> <vx ...
title: Nuxt.js 应用中的 dev:ssr-logs 事件钩子 date: 2024/11/28 updated: 2024/11/28 author: cmdragon excerpt: dev:ssr-logs 是一个用在服务器端渲染(SSR)中,用于输出日志的事件钩子。这个钩子会在 ...
在公司开发大型项目中,使用主流表格库 vxe-table v3 和 ant-design-vue 组件库,可以在可编辑单元格中渲染非常简单的使用更多的组件 官网:https://vxetable.cn 安装 npm install vxe-pc-ui@3.3.9 vxe-table@3.11.10 ...
在 vxe-table 启用列多选功能,通过参数 column.type = 'checkbox' 设置类型为多选类型就可以了。 官网:https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </ ...
在 vxe-table 启用列单选功能,通过参数 column.type = 'radio' 设置类型为单选类型就可以了。 官网:https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div ...
在 vxe-table 使用排序功能非常简单,给列加上 columns.sortable 属性就可以启用列的排序功能,当然这是本地排序,就是对当前已加载过当前页的数据进行排序。对于查询列表列表,项目中使用最多的是服务端排序,因为大部分都涉及分页。 前端排序 这样就可以启用前端数据排序,仅限于当前页 ...
实现表格数据分组,按指定字段数据分组,使用树结构来实现分组功能。 官网:https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div> </template> <script> import ...