- 博客(7)
- 收藏
- 关注
RSS订阅原创 Ant Design 的DatePicker 日期选择框的简单使用
如果需要默认就在选择框内显示近7天的时间，可以定义一个dayjs对象数组，通过dayjs获取目标时间。如果想重置选择框中的内容，直接将 time 的值设置为 undefined 即可。通过回调函数 onRangeChange 可以获取目标格式的选择时间，例如。点击选择框中的清除按钮，也会触发 @change。工作中经常用到，所以记录一下以便后续使用。如果不需要默认显示可以定义为。
2025-04-22 18:51:52
142
原创 利用Echarts关系图实现简单服务器拓扑图
其中series中的 data: [] 与 links: [] 中的内容均可以通过异步获取，但是要注意，应该在 option 中将这两个数组设置为空后在异步函数中直接给数组赋值，否则异步获取的内容不会显示。工作中遇到的小问题，总结一下以便后续查看。然后在按照这样拼接即可使用。
2025-04-21 17:23:29
220
原创 Ant Design穿梭框的基础使用
属性，还有可选的description: string，disabled: boolean以及chosen: boolean。只需要给 data-source 和 target-keys 赋值即可使左右两侧都有数据显示，但要注意格式和key的匹配。进行匹配，如果匹配成功，那么该项会显示在右侧面板；仅表示勾选状态，不影响最终已选数据，点击操作按钮（如“添加”）后，该数组通常会被清空。可以将穿梭框中的数据分成三个部分：全部的数据、已选择的数据、右侧框中的数据id。中的 key 一样的值即可，例如。
2025-04-19 23:19:54
149
原创 实现Echarts环形图中间及图例内容的自定义展示
因为展示页面要使用多个Echarts图，所以将除了option以外的其他基础部分封装在了一个简易的组件中，通过props传入option，然后在mounted钩子中初始化echarts，并在onUnmounted钩子中销毁echarts实例，最后在window的resize事件中调用echarts的resize方法，实现echarts的响应式。因为异步获取数据会慢于这里的赋值，因此会出现数据还未准备好就被赋值给data的情况，导致Echarts图不展示。工作中遇到的小问题，总结一下以便后续查看。
2025-04-15 18:55:55
354
原创 前端在修改数据后直接关掉对话框会改变原始数据
在点击修改按钮后通过props由父组件将这一行表单的对象传给子组件，在子组件中通过toRefs结构props，然后将父组件传来的对象赋值给子组件的对象。即只能展开和深拷贝第一层的值，对于第二层及其以后的值，展开运算符将不能对其进行打散，也不能对其进行深拷贝，即拷贝后和拷贝前第二层中的对象或者数组仍然引用的是同一个地址，其中一方改变，另一方也会跟着改变。遇到的问题是，在修改页面修改了数据之后又不想改了，于是点击了取消，即直接关闭了这个对话框，再次点击修改，发现原先的数据变成了刚才修改但是未提交的数据。
2025-04-09 19:46:46
173
原创 一条记录关联多个类型及所用时间的汇总结果并一同展示
现在的需求简而言之，就是设备信息表要关联故障历史表，而故障历史表中有故障类型与维修所用时间，因为一台设备有多次维修记录并且故障的种类也不一样，要实现的是一条查询结果中包含设备信息以及对应各类型发生时间距离现在最近的故障，如果直接连表则会返回多条记录信息，而现在的要求是一台设备对应一条结果。可以利用下面的函数来处理，处理的数据例如："0-1,1-5"，表示故障类型0，维修这种类型用时1小时，1-5同理。这样前端接收到数据之后就可以对字符串类型的故障相关信息进行处理。
2025-03-30 15:16:10
194
原创 简单的指向箭头带无限流动效果
在项目中用到的最基础的横向与纵向的动态直线，记录以方便后续使用。1.横向动态指向箭头效果。2.纵向动态指向箭头效果。
2025-03-22 22:27:26
354
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人