提供3000多款全球软件/控件产品
针对软件研发的各个阶段提供专业培训与技术咨询
根据客户需求提供定制化的软件开发服务
全球知名设计软件,显著提升设计质量
打造以经营为中心,实现生产过程透明化管理
帮助企业合理产能分配,提高资源利用率
快速打造数字化生产线,实现全流程追溯
生产过程精准追溯,满足企业合规要求
以六西格玛为理论基础,实现产品质量全数字化管理
通过大屏电子看板,实现车间透明化管理
对设备进行全生命周期管理,提高设备综合利用率
实现设备数据的实时采集与监控
利用数字化技术提升油气勘探的效率和成功率
钻井计划优化、实时监控和风险评估
提供业务洞察与决策支持实现数据驱动决策
转帖|产品更新|编辑:莫成敏|2019-12-27 11:10:51.130|阅读 461 次
概述:本次发布,WijmoJS 将支持 Angular 9 和 Ivy 编译器!与此同时,WijmoJS 还提供了用于 React 和 Vue 框架的 FlexGrid 单元格模板,以及针对 Vue 组件的双向绑定模式,不但简化了表单填报的步骤,还增强了 FlexGrid 的实用性性能。最后,针对 TypeScript 类型,WijmoJS 同样进行了优化,使其在 VSCode 中更易于使用。
# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>
WijmoJS是为企业应用程序开发而推出的一系列包含HTML5和JavaScript的开发控件。其中包含了金融图表、FlexSheet、先进的JavaScript控件(Wijmo 5)和经典的jQuery小部件(Wijmo 3)。无论您的应用程序是移动应用还是必须要支持IE6,Wijmo Enterprise均能满足您的需求。
本次发布,WijmoJS 将支持 Angular 9 和 Ivy 编译器!与此同时,WijmoJS 还提供了用于 React 和 Vue 框架的 FlexGrid 单元格模板,以及针对 Vue 组件的双向绑定模式,不但简化了表单填报的步骤,还增强了 FlexGrid 的实用性性能。最后,针对 TypeScript 类型,WijmoJS 同样进行了优化,使其在 VSCode 中更易于使用。
前端开发工具包 WijmoJS V2019.0 Update3 的主要新特性有:
与时俱进!WijmoJS 将支持 Angular 9 和 Ivy 编译器
针对 Vue 框架:加入 FlexGrid 单元格模板、Vue 组件的双向绑定机制
针对 React 框架:加入 FlexGrid 单元格模板
表格组件(FlexGrid):多列排序、冻结列、全文搜索、转置表格、保存 CSV 等
多行网络(MultiRow):支持聚合组、列标题布局功能
图表组件(Chart):加入阶梯图
CollectionView :过滤器增强
更新详细内容:
与时俱进!WijmoJS 将支持 Angular 9 和 Ivy 编译器
每当 Angular 发布最新版本,WijmoJS 必定第一时间与之兼容!
本次发布,WijmoJS 将支持 Angular v9.0.0-rc.2 版本,并与最新的 Ivy Compiler 兼容。
开发者在使用 WijmoJS 的时候,完全不必考虑其在 Angular 框架下的兼容性问题,因为 Angular 技术团队在模块打包时,就已经为我们提供了一些建议,并帮助我们对编译器进行了优化。
正是在 Angular 和 WijmoJS 技术团队的共同努力下,开发者才可以更快的使用 Ivy Compiler 构建企业级 Web 应用程序。
一流的框架集成:WijmoJS 针对 Vue 的更新
FlexGrid 单元格模板
单元格模板是 FlexGrid 组件在 Angular 框架下最受欢迎的功能之一。现在,WijmoJS 分别针对 Vue 和 React 框架,提供了这个强大的功能。
单元格模板适用于在表格组件(Grid)的任何单元格中声明标记、表达式和自定义内容。
<wj-flex-grid-column header="Country" binding="country" width="*"> <wj-flex-grid-cell-template cellType="Cell" v-if="customCell" v-slot="cell"> <img :src="'resources/' + cell.item.country + '.png'" /> </wj-flex-grid-cell-template> </wj-flex-grid-column>
针对 Vue 组件的双向绑定
双向绑定在 Vue 中是一种强大的机制,可用于简化表单填报的实现步骤,Vue 提供了两种用于声明双向绑定的语法:v-model 指令和 sync 绑定修饰符。
在 WijmoJS 的输入组件中,已支持上述两种双向绑定语法,因此您可以根据项目需要在它们之间进行选择。
一流的框架集成:WijmoJS 针对 React 的更新
就像在 Angular 和 Vue 中一样,您同样可以在 React 中使用 FlexGrid 的单元格模板,这些单元格模板允许您向 React 数据表中的任何单元格添加自定义内容。
单元格模板功能,使自定义 FlexGrid 中的任何单元格都变得非常容易。
仍以下面这些国家/地区列中呈现标志图像的示例为例:
<wjGrid.FlexGridColumn header="Country" binding="country" width="*"> <wjGrid.FlexGridCellTemplate cellType="Cell" template=(context) => { return <React.Fragment> <img src={`resources/${context.item.country}.png`} /> {context.item.country} </React.Fragment> } /> </wjGrid.FlexGridColumn>
如您所见,“单元格模板”中的可定义内容,包含了标记、HTML 语法,甚至可以绑定其他组件。
面向原生 JavaScript 的 FlexGrid 单元格模板
除了Angular、React 和 Vue 框架,WijmoJS 针对纯 JavaScript 的 FlexGrid 组件也同样添加了新的单元格模板。如今,WijmoJS 的 Column 类具备了一个全新属性—— cellTemplate,该属性允许自定义渲染单元格,而无需借助 formatItem 事件。
Column.cellTemplates的使用,比在 Angular、React 或 Vue 中使用单元格模板还要简单。仅需声明模板字符串,就可以在其中放置 HTML 元素,甚至绑定表达式,而这些表达式将由 WijmoJS 的 glbz 方法解析并呈现在单元格中。
同样是 “国家/地区”列中呈现标志图像的示例代码,相比于 Vue 和 React 框架,更加清爽、简单:
<pre> columns:[{ header:'Country', binding:'country', width:'*', cellTemplate:'<img src="resources/${item.country}.png"/> ${text}' }] </pre>
针对表格组件(FlexGrid)的更新
FlexGrid 多列排序
FlexGrid 依赖于 CollectionView 类对数据进行排序。此前,WijmoJS 表格组件中的 allowSorting 属性是一个布尔值,它用来确保用户是否可以通过单击单元格的标题来对列进行排序,该属性的机制仅允许用户同时对单个列进行排序。
在 WijmoJS 的新版本中,allowSorting 属性被扩展为以下属性的集合(不单单是布尔类型):
AllowSorting.None:用户无法通过单击列标题来对列进行排序,这与在先前版本中将 allowSorting 设置为 false 的表现相同。
AllowSorting.SingleColumn:用户可以对单个列进行排序。单击列标题可对该列进行排序或翻转排序的方向(升序、降序)。 使用 Ctrl + Click 即可删除排序,这与在先前版本中将 allowSorting 设置为 true 的表现相同。
AllowSorting.MultiColumn:用户可以对多列进行排序。单击列标题可对该列进行排序或翻转排序的方向(升序、降序)。使用 Ctrl + Click 即可删除该列的排序, Ctrl + Shift + Click ,即可删除所有排序状态。
在多列排序时,列标题旁边的箭头显示了当前列的排序顺序:
FlexGrid 冻结列
FlexGrid 支持通过代码冻结行和列,但在此之前,从未公布过用于控制此功能的 UI。
在本次更新中,WijmoJS 添加了 allowPinning 属性,该属性可将图钉(pin 字形)添加到列标题中,通过单击图钉可实现冻结或取消冻结列:
FlexGrid 全文搜索
FlexGrid 支持使用 FlexGridFilter 组件,实现基于列的类似 Excel 那样的过滤方式。
在本次更新中,WijmoJS 添加了全新的 WijmoJS.grid.search 模块,该模块带有一个 FlexGridSearch 控件,该控件提供了全文本搜索/过滤器界面。
当用户在 FlexGridSearch 控件键入数据时,它将根据搜索文本过滤项目,自动突出显示匹配项,已达到全文搜索的目的:
如上图所示,FlexGridSearch 控件可以与 FlexGridFilter 组件一起使用。
转置表格
在常规表格中,同一项目在一行内显示,项目的属性在同一列中显示。
而在转置表格中,每个项目变成由同一列来表示,行显示的是项目属性。
为了实现上述需求,WijmoJS 添加了一个带有 TransposedGrid 控件的模块 —— Wijmo.grid.transposed,其中数据项目显示为列,其属性显示为行。
即便此前我们已经可以通过 FlexGrid 的 API 创建类似的转置视图,但通过 TransposedGrid 控件,将使这项工作变得更加容易。
保存 CSV 文件
FlexGrid 支持将表格中的数据保存为其他格式,如 CSV。
在本次更新中,WijmoJS 添加了两个功能,使保存 CSV 文件变得更加轻松:
在 WijmoJS 中添加了 saveFile 方法,可以直接通过该方法保存 CSV 文件,而不必一遍又一遍地复制相同的代码。
表格组件(Grid)的 getClipString 方法现在加入了一个 options 参数,该参数使您可以精确地指定生成剪辑字符串的方式。
通过上述更改,您可以使用两行代码保存 CSV 文件:
get clip string (current selection, with column headers) const clipString = grid.getClipString(null, options, true, false); // save to a file saveFile(clipString,'flexgrid.csv');
也可以通过 ClipStringOptions 属性完成更多功能:
ClipStringOptions.Default:使用默认选项(制表符作为单元格分隔符,带格式的/可见的/未引用的单元格),执行复制/粘贴到剪贴板时内部使用的格式。
ClipStringOptions.CSV:使用逗号作为单元格分隔符(CSV 格式),这也是导出 CSV 文件时的默认格式。
ClipStringOptions.QuoteAll:引用所有单元格,将所有单元格都用引号引起来,而不是仅对包含逗号和引号的单元格,这项改动将使输出文件更易于解析。
ClipStringOptions.SkipMerged:跳过已合并的单元格(如 Excel 一般)。在某些情况下,这使得输出文件更易于阅读。
ClipStringOptions.Unformatted:导出未格式化的值。与仅保存格式化的值相反,此格式保留了数值的全部精度。
ClipStringOptions.InvisibleRows:在输出中包括不可见和折叠的行(默认情况下,不包括不可见和折叠的行)。
ClipStringOptions.InvisibleColumns:在输出中包括不可见的列(默认情况下,不包括不可见列)。
ClipStringOptions.InvisibleCells:在输出中包括不可见的单元格。
更多 FlexGrid 增强功能
可折叠列组:以声明的方式创建可折叠列组。通过将 columns 属性(或 columnGroups 属性)设置为包含列定义的数组来完成,其中定义包含子列的“columns”集合。
添加了静态属性—— defaultTypeWidth,该属性允许根据自动生成的网格列的数据类型来指定默认宽度。
改进的剪贴板功能:添加了 copyHeaders 属性,该属性可让指定在将数据复制到剪贴板时,是否应包含行标题或列标题。
RowDetail 冻结单元格:允许单元格明细跨越冻结边界。
针对多行网络(MultiRow)的增强
MultiRow 聚合组:添加了 multiRowGroupHeaders 属性,该属性允许标题具有多个标题行(适用于显示聚合)。
MultiRow 列标题布局:添加了 headerLayoutDefinition 属性,该属性可让您定义列标题的自定义布局。
图表组件(Chart)加入阶梯图
StepLine Charts(阶梯图)常用来显示特定时间点的变化,它们对于查看值随时间变化的大小十分有用。
WijmoJS 在 FlexChart 图表组件中添加了阶梯图、StepSymbols 和 StepArea 等图表类型。
CollectionView 过滤器增强
WijmoJS 添加了包含过滤器功能数组的 filters 属性,该属性可以链接具有多个独立过滤器功能的过滤器。
产品易用性提升
WijmoJS 的信息提示在本次更新中做了重大改进,这些改进将使 WijmoJS 更易于使用,并且帮助开发者更轻松地找到代码中的错误。
您可以在回调函数(以前只是通用的 Any 类型)中看到这些提示:
WijmoJS 更多增强点:
将信息提示添加到了 “any”类型的多个回调函数和属性中。
向事件类的发送方和参数添加了通用类型。
为 CollectionView 和 ObservableArray 类添加了通用类型,可通过以下代码实例化 Customer 对象:var cv = new CollectionView(data); var customer = cv.currentItem; // customer是Customer的一个实例
提供了编译时错误检查和 IntelliSense,确保开发者可以更快地编写更好的代码。
想要购买WijmoJS 正版授权,或了解更多产品信息请点击
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn
文章转载自:知名C/C++开发工具CLion全新发布v2024.3,新版本新语言引擎有显著改进等,欢迎下载新版体验!
强大的VS插件CodeRush已正式发布v24.2.3,新版本现在可以运行xUnit.Net v3测试等,欢迎下载最新版体验!
Spire.PDF 10.12.4 最新版本支持在进行多页打印时设置自动旋转方向。同时,一些已知问题也在本次更新中被成功修复,例如打印 PDF 文档时内容丢失的问题,欢迎下载体验~
日程安排控件dhtmlxScheduler v7.2全新发布,新版本增强并增加了编辑、修改等多个操作体验,欢迎下载最新版试用~
新一代的HTML5/JavaScript UI控件,为您的企业应用提供更加灵活的体验。
WijmoJS CoreWijmoJS Core是包含最新技术的新一代JavaScript 控件
Spread for WinForms受欢迎的兼容Microsoft Excel的.NET电子表格控件
Spread for ASP.NET超强兼容的表格控件,拥有类似Excel的强大功能
Spread COMSpread——世界上畅销的电子表格COM组件。
服务电话
重庆/ 023-68661681
华东/ 13452821722
华南/ 18100878085
华北/ 17347785263
客户支持
技术支持咨询服务
服务热线:400-700-1020
邮箱:sales@pclwef.cn
关注我们
地址 : 重庆市九龙坡区火炬大道69号6幢