- 2025-01-14【VUE】页面跳转实现动态样式控制
【VUE】父子组件联动实现动态样式控制跳转得到的参数大概有这些:handleToPage:function(action,id,key="form",queryParam={}){this.$router.push({path:`${this.routeKey}/${key}/${action}${id?"/"+id:""}`,query:quer
- 2025-01-14【VUE】父子组件联动实现动态样式控制
相关组件:父组件:src/views/erp/contract/Form.vue子组件:src/views/erp/contract/modules/PlanTable.vue实现思路:1.根据已有的isEdit判断状态是不是编辑或者新增,将状态传递给子组件2.子组件根据状态来决定是否添加星号样式具体方法:1.将原来的固定样式,改为动态样式{title
- 2025-01-09折线图
myChart.setOption({title:{text:'2024年全国降雨量统计',show:false},legend:{show:true},toolbox:{show:true,feature:{magicType:{show:true,type:['stack','tiled']},saveAsImage:{show:true}}},tooltip:{},xA
- 2024-12-13echarts 可拖拽雷达图 拖拽雷达图角标 动态改变数据
基于echarts实现可拖拽雷达图,不管多少个角标都可以实现效果其中细节主要在于拖拽点的位置怎么来,角度以及拖拽后如何移动位置 以及如何沿着轴线拖动 不能随意拖动 直接上代码import*asechartsfrom'echarts';//importi18nfrom"@/i18n"functionshowTooltip(myC
- 2024-11-26AntDesign - Vue Table组件 实现动态表格、表头分组的功能(方式一)
一、功能分析产品经理要求企微主体名称是配置项且后期可修改或增加,各企微主体账号的数据一对应。前端开发设计方案为:静态列(左部分)在前端写,配置项由后端接口返回,再动态追加到columns中,根据表头dataIndex对应的数据项,填充到数据数组dataSource。至此,开发思路出来
- 2024-10-13【ant.design ProDescriptions详细介绍写法】
代码解析实现效果代码块<ProDescriptionstitle={"详细信息"}column={1}columns={[{title:'姓名',dataIndex:'Name'},{title:'年级',dataIndex:&
- 2024-07-23vue3 + arco design vue 表身单元格合并
表格展示效果如下图:后端返回的数据格式如下arcodesignvue单元格合并还挺复杂的,今天接到这个需求时,还是有点无从下手,后来经过一些列尝试之后得出如下代码<a-tableclass="table-data":data="tableData":bordered="{wrapper:true,cell:true}":span-method="dat
- 2024-06-17Ant-Design-Vue动态表头详细解释并填充数据
AntDesignVue的a-table组件是构建数据表格的强大工具。动态表头意味着列的标题和属性(如排序、过滤等)可以在运行时确定,通常基于从服务器获取的数据结构。以下是详细解释如何实现动态表头并填充数据:1.准备数据源动态表头的数据源可能来自API的响应,该响应定义了表格的列结
- 2024-06-06如何在Ant-Design-Vue中实现动态表头并填充数据
在现代前端开发中,基于Vue.js的AntDesignVue已经成为许多开发者构建高质量用户界面的首选工具之一。它提供了一整套丰富的UI组件,其中的Table组件广泛应用于数据展示和操作。本文将深入探讨如何在AntDesignVue中实现动态表头并填充数据,以满足复杂多变的业务需求。一、引言
- 2024-05-14NPOI读取模板文件生成Excel
前不久实现了用NPOI组件替代Microsoft.Office.Interop.Excel原生组件实现导出数据到Excel的需求,其中踩了几个坑,这里记录一下。不能使用wps创建模板文件不能使用一个文件流,对已存在Excel文件进行修改NPOI中sheet、row、cell都是以0作为起始序号,Office原生组件是以1作为起始序
- 2024-04-17WPF随笔收录-实时绘制心率曲线
一、前言在自己的项目中,涉及到实时心率曲线的绘制,项目上的曲线绘制,一般很难找到能直接用的第三方库,而且有些还是定制化的功能,所以还是自己绘制比较方便。很多人一听到自己画就害怕,感觉很难,今天就分享一个完整的实时心率数据绘制心率曲线图的例子;之前的博客也分享给DrawingVis
- 2024-04-08echarts可拖拽折线图,拐点拖拽/点击定位/整体平移
1.拐点拖拽,只有点击拐点才可以拖拽,并且限制了只能在当前X轴进行拖拽//chart myChart(){ constthat=this letsymbolSize=20; letdata=newArray(); letdataReal=newArray(); //this.real letlist=this.plan; letr
- 2024-02-21(ColumnTypes[number] & { editable?: boolean; dataIndex: string; })[] 是什么意思
(ColumnTypes[number]&{editable?:boolean;dataIndex:string;})[]在TypeScript中,这段类型定义可以分解理解:ColumnTypes[number]:首先,如果ColumnTypes是一个数组类型(如Column[]),那么ColumnTypes[number]就是获取数组中的元素类型。在TypeScript中,number表示数组
- 2024-02-19ProTable双击可编辑
要实现在AntDesign的Table组件中双击单元格修改内容,你可以通过以下步骤来实现:创建一个React组件,并引入所需的依赖:npminstallantd编写示例代码:importReact,{useState}from'react';import{Table,Input}from'antd';constEditableTable=()=>{c
- 2024-02-02echarts饼状图点击选择功能
我们在使用echarts的时候,不免会遇到点击饼状图进而让其他地方数据发生变化的功能,这时候我们就需要将当前点击的饼状图区域放大显示(选中状态)。1.vue<divref="csRef"></div>2.方法constcsRef=ref()letmychart=""constchartIndex=ref()//渲染constrenderFun=()
- 2023-11-13vue3中的vue-18n的table表格标题不动态变化中英文
使用computed即可 eg:constcolumns=computed(()=>{returnreactive<any>([{title:proxy.$t('device.pm.table.index'),dataIndex:'index',width:50,slotName:'indexsort',ellipsis:true,
- 2023-10-17在react项目中结合antd实现表格tooltip提示
react项目antdesign给表格title添加tooltip提示效果,效果如下: title:()=>( <span> {'原表'} <Tooltip title={'如有颜色标注则表示id在该表无数据'} > <InfoCircleOutlined
- 2023-10-11巧用指标平台DataIndex,五步法轻松实现指标管理
开发部门在做指标加工的全流程中,是否经常出现如下问题:·业务部门看指标数据的时候,看到两个名称相似的指标,不清楚两个指标的差异性,来咨询开发部门指标计算口径,开发部门配合业务部门翻找代码,找出指标口径差异性,影响工作效率·业务部门看指标数据的时候,总会出现不同页面的同一指
- 2023-09-17ant design pro改造表格页面
找到src/pages/TableList/index.tsx先ctrl+shift+-全局压缩在TableList找到columns换成我们自己的ProColumns中放的是数据下图为API.InterfaceInfoconstcolumns:ProColumns<API.InterfaceInfo>[]=[ { title:'id', dataIndex:'id',
- 2023-08-13Pixi.js的使用整理
最近在做的一个前端项目中,有一些图像的处理操作(3D图,2D图都有),其中3D图也是通过获取后端服务的图像2D数据进行绘制展示,通过鼠标各种操作调用后端服务来进行重新获取新图数据。这里前端设计到图像的操作使用了PIXIJS,这里将使用的方式做一个说明,以作参考。首先pixijs的官网:https://pi
- 2023-07-21STM32F103内部FLASH及地址表
在我们应用开发时,经常会有一些程序运行参数需要保存,如一些修正系数。这些数据的特点是:数量少而且不需要经常修改,但又不能定义为常量,因为每台设备可能不一样而且在以后还有修改的可能。将这类数据存在指定的位置,需要修改时直接修改存储位置的数值,需要使用时则直接读取,会是一种
- 2023-06-27echarts绘制地图使用dispatchAction方法高亮区域
1.高亮方法代码如下:highlightMap(myChart){//高亮轮播展示varindex=0;this.timer=null;this.timer=setInterval(()=>{myChart.dispatchAction({type:'downplay',//取消高亮seriesIndex:0})myChart.dispatchAction({
- 2023-06-18点击echarts图。获取点击事件
自动跳转复用代码:letdataIndex=param.dataIndexthis.$nextTick(()=>{this.$refs.multipleTable0.bodyWrapper.scrollTop=(this.$refs.multipleTable0.bodyWrapper.scrollHeight*(this.tableList.len
- 2023-06-03【React工作记录八十三】React+Hook+ts+antDesign实现table行编辑功能
前言大家好我是歌谣今天要说的是antdesign实现表格行编辑的功能考虑问题的时候我们需要多看官方的api开发开始紧接着我们对照着api进行开发首先加一个table<TableonChange={onTableChange}rowKey="id"