- 博客(49)
- 收藏
- 关注
RSS订阅原创 vue 表格分页打印，字体自适应大小缩放。
因表格内字数不确定，1页强制10行，有的页面很短，有的页面会超出，效果不好，需要每个单元格内大小自适应表格调整。通过计算每个单元格的大小、可容纳的文字数量与实际的文字数量的比例来动态控制每个单元格内文字的缩放比例。(3）同时要注意，字母，数字，英文标点符号，占的比例应该为字体的0.6倍左右，需要处理。单元格内字数如果超过可能容纳最多的字数，那么字体需要缩小，如果不超过，那么不需要缩小。如果字体大小超过默认字体大小，不需要改变，如果小于默认字体大小就是需要缩小的。(1) 计算每个单元格容纳的标准字体个数。
2024-04-29 08:32:24
619
1
原创 bootstrap带左右固定列表格，列选择操作后，表头和内容无法对其问题。
然后，表头固定列失效了，因为表头固定列的宽度计算方式和内容的不一致，滑动的时候，看不到表头了。（2) 列变动后，选择列数较少时，左右固定列消失，表头和表格无法自适应对齐问题。（1）列变动后，列总数量依然较多存在滚动轴时，右侧少一部分问题。解决：通过onColumnSwitch 列切换操作时候的函数。通过属性showColumns: true,开始列选择后，后来又发现点击排序按钮后，表头和内容又对不齐了。
2024-04-26 10:54:40
405
原创 html表格导出为word文档，导出的部分表格内无法填写文字
把部门领导意见部分页面布局修改一下，红色部分使用一个td布局，同时把边框变为白色，就能写字了。导出的word如下，样式没问题，但是红色区域写不了字。
2024-04-26 10:41:52
643
原创 window.open跳转页面，之前打开的页面不再打开重复的新窗口
已有窗口不再重新打开: window.open(url,url)会打开新窗口 : window.open(url)
2024-04-17 16:53:56
463
原创 vxe-table的编辑表格只校验临时变动的数据
表格第一次校验的时候，做了整体校验，校验不通过，当有添加行或者删除行的时候，便只校验操作行，便校验通过了。解决：只需要加上fullValidate()方法加上true即可。使用官网上的完整校验。
2024-04-15 10:11:18
296
原创 Antd 日期组件 a-date-picker 选中后无法关闭面板弹窗
3.借助:open="yearPickShow"控制日期面板的开关，借助@panelChange和@openChange完成选中后的关闭。1.设置 DatePicker 的mode="year"属性，可以实现按年的选择。2.选择完成之后，日期面板不会自动关闭，需要点击一下才行，这样的交与体验不太好。placeholder="请选择年份"-- 年选择组件 -->
2024-04-11 17:22:25
355
原创 带合并行、分组表头和分组表格导出excel
注意：表格要使用包起来，后面导出使用。未合并之前把数据处理成这样展示即可，根据后端返回的json自行处理。先要把json数据处理成一行一行的表格数据，然后再做合并行。在index.html中引入。
2024-04-02 15:55:47
663
原创 zTree做拖拽移动功能，并保存数据到数据库
思路：zTree的拖拽移动功能是组件自带的，通过setting配置即可，保存到数据库则需要拿到移动节点id和目标父级id，后端去处理，把移动节点的数据挂到目标父级的下面。
2024-03-15 16:57:10
569
原创 vxe-table3.0的表格树如何做深层查找，返回搜索关键字的树形结构
（2）this.originData = 树形结构表格数据 ，搜索的时候，originData还是树形结构的，2.0版本的XEUtils.searchTree还是可以使用的，搜索结果是树形结构，那么把这个树形结构的搜索结果再转成扁平结构赋给表格，就能得到搜索结果也是虚拟滚动的啦。vxe-table2.0版本是提供深层查找功能的，因为他的数据源本身就是树形结构，所以深层查找查询出来也是树形结构。如果后端给你的本来就是扁平化的数据，也是一样的，你把他处理成树形结构，在页面循环使用是一样的思路。
2024-01-30 17:08:06
993
原创 vxe-table从2.0升级到3.0，vxe-table-plugin-virtual-tree虚拟滚动失效
问题：系统一直使用的vxe-table2.0，vxe-table2.0不支持树的虚拟滚动，为了解决这个问题，引入了vxe-table-plugin-virtual-tree插件，现在系统vxe-table升级3.0，vxe-table-plugin-virtual-tree的虚拟滚动失效了。原因：查询官网，发现vxe-table-plugin-virtual-tree依赖于2.0版本，因为3.0版本已经有自己的虚拟树了，便不再在维护了。。解决：还能咋办，换树。支持虚拟滚动的树有很多。
2024-01-30 16:39:52
662
原创 vxe-table表格合并行和虚拟滚动冲突
总结：方法一：升级表格，对当前需要虚拟加载的合并行表格页面修改的不多，但是升级表格会有系统有不可预知的影响，比如一些废弃的api需要更换，我们之前用的vxe-table-plugin-virtual-tree需要依赖于vxe-table2.0，升级后组件虚拟滚动功能会失效（如何解决下一篇写）等等。具体可以自己看官网，但是他的表格功能没有vxe-table丰富，如果使用，之前的逻辑的逻辑要改的太多，便没有采用。做临时合并，我们只要把表格的需要合并状态全部计算提取出来，便可以实现合并行的虚拟滚动。
2024-01-30 15:58:35
1642
原创 input的回车键搜索，失焦搜索
a-input placeholder="输入关键字进行搜索" v-model="filterText" @blur="filterSearch" @keyup.13="filterSearch">
2024-01-17 10:14:34
446
原创 vxe-table循环的vxe-table-column 如何进行edit-rules校验
2.现在需要对hasDistribut这个字段进行校验，但是这个字段在经过循环后，已经衍生成hasDistribut_0 . hasDistribut_1 .hasDistribut_2 .hasDistribut_3等等，在data里面肯定无法直接定义了,需要在生成departList的地方将hasDistribut的校验也循环生成。edit-rules的快速校验有一个特点，就是发生了edit的表格才会校验，如果这个数据是初始化带来的的，一样可以通过校验。1.循环vxe-table-column。
2024-01-09 15:22:39
1357
原创 超大量数据，前端树形结构展示
由于在点击节点时才进行该层数据的获取，默认情况下 Tree 无法预知某个节点是否为叶子节点，所以会为每个节点添加一个下拉按钮，如果节点没有下层数据，则点击后下拉按钮会消失。同时，你也可以提前告知 Tree 某个节点是否为叶子节点，从而避免在叶子节点前渲染下拉按钮。}, 500);
2023-12-22 16:30:47
7164
3
原创 vxe-tree默认展开全部，默认展开指定行。
rows是个数组，默认展开第一级，this.$refs['xTree'].setTreeExpand(this.treeData, true);循环this.treeData，把前两级的数据放到数组里面。展开全部：setAllTreeExpandt。默认展开指定行：setTreeExpand。
2023-11-21 14:44:51
542
原创 Ant Design Popover 组件不随着页面而滑动
" />range-picke组件类似。添加 :getPopupContainer="triggerNode => {return triggerNode.parentNode || document.body;
2023-11-15 20:15:17
302
1
原创 vxe-table表格数据过多时合并行错行折行问题
添加:scroll-y="{enabled:false}"属性即可。empty-text="请按回车添加行"
2023-11-15 20:14:39
424
1
原创 对表格内的Input框进行校验，表格有多行，需要循环校验。
第三步：循环校验，定义一个参数，当校验通过的数量等于所有表格行数量的时候，才算全部校验通过。第一步：通过a-form-model自带的rules规则校验 和动态ref实现。第二步：编写校验规则。
2023-11-09 20:22:58
119
原创 ant-design-vue的a-form-model表单，a-form-model-item项用v-if切换时，校验不生效问题
原始代码确认校验代码。
2023-11-09 20:12:58
875
原创 vue使用echarts-liquidfill水球图不生效问题
1.安装对应版本的echarts和echarts-liquidfill。2.使用时，在页面引入。
2023-09-27 14:23:48
294
原创 【antd-vue】 tab切换前根据情况判断是否允许切换拦截阻断antd-vue tab组件切换
【antd-vue】 tab切换前根据情况判断是否允许切换拦截阻断antd-vue tab组件切换
2023-07-10 17:32:01
555
原创 在使用$attrs和$listeners两个跨层传输数据的时候事件及数据拦截情况
相反，孙组件向上级传递事件的时候，如果子组件中有@change="onChange",父组件也有@change="onChange"的时候，那么这两个事件都会被传递出去，也就是说，onChange()函数会执行两次，一次父组件，一次子组件的。1，组件封装的时候，在使用$attrs和$listeners两个跨层传输数据的时候，中间层如果设置了props:['value'],则父组件绑定的value值是传输不到孙组件，因为被子组件给拦截了，
2023-05-29 15:21:46
80
原创 router.beforeEach对面包屑进行修改
to.meta.title = to.meta.title.slice(0, to.meta.title.length-2) + "编辑"to.meta.title = to.meta.title.slice(0, to.meta.title.length-2) + "新增"很多系统，新增和编辑用的是同一个页面，面包屑的名称是根据配置的菜单名称获取的，所以都会显示同一个名字。例如可以 编辑的页面路由会由query传参，的区别加以判断。
2023-05-29 11:43:23
161
原创 修改 node_modules 中的依赖包 patch-package
把node_modules 里面的文件修改后，避免每次npm install 后都要重新修改底层代码，可通过patch-package解决。npx patch-package 第三方包名字。就会在patches文件夹生成文件。第一步，修改第三方包。
2023-05-25 16:53:19
167
原创 Echarts二次渲染，出现渲染不全，dom已存在，上次渲染视图遗留问题.
Echarts二次渲染，出现渲染不全，dom已存在，上次渲染试图遗留问题.
2023-01-31 13:55:21
611
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人