强不强？能在多种前端框架下使用的表格控件

沈俭发布于2019-08-01 16:19 / 2831人阅读

摘要：近几年前端框架特别流行，比如等。有没有能够在多种前端控件下都能使用的表格控件还真有中的，能支持很多主流的框架。在纯下使用文件引入的文件和样式引入和文件。获得控件，并进行数据绑定。

近几年 Web 前端框架特别流行，比如 AngularJS、AngularJS 2、ReactJS、KnockoutJS、VueJS 等。表格控件是我们在开发中经常要用到的控件。有没有能够在多种前端控件下都能使用的表格控件？还真有！Wijmo中的FlexGrid，能支持很多主流的框架。这里主要介绍在纯 JavaScript 和 AngularJS 下的使用方法。

在纯 JavaScript 下使用

HTML 文件：

引入Wijmo的JS文件和样式：wijmo.min.css 、wijmo.min.js、wijmo.grid.min.js

引入app.js和FlexGrid.js文件。

定义一个div元素用于显示Grid

在app.js中定义appData，其中的getData方法根据传入的Count产生数据。

FlexGrid.js：

在FlexGrid.js中调用data.getData(30)获取数据30个数据。获得FlexGrid控件，并进行数据绑定。

下面就是运行结果：

在AngularJS下使用FlexGrid

HTML文件：

引入angular.min.js

引入Wijmo相关的文件wijmo.min.js、wijmo.grid.min.js、wijmo.angular.min.js、wijmo.min.css

引入app.js和control.js

添加NG指令ng-app、ng-controller

通过wj-flex-grid指令定义表格，并设置数据源

app.js文件：

control.js文件：

其运行结果和纯JS的结果完全一样。

结语

通过上面的两个示例可以看到，无论是在纯JS中还是在AngularJS中，使用FlexGrid都非常简单。尤其是在 AngularJS 框架中通过 Wijmo 自定义的 Angular 指令 wj-flex-grid，使用表格控件很容易。Wijmo 支持 AngularJS、AngularJS 2、ReactJS、KnockoutJS、VueJS、Ionic等前端框架，就不在一一示例。FlexGrid 的功能包括排序、过滤、分组、分页、单元格合并、冻结、格式化、条件样式、单元格模板、主题、树形结构等。感兴趣的同学可以做扩展阅读，链接如下：

Wijmo 中文官网

FlexGrid 详细功能介绍

点击此处，可下载本文中介绍的示例源码

云服务器 GPU云服务器多种js开发框架控件的使用 js和前端框架的优势 mt4能在云服务器上使用吗

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/50438.html

Vue 2019开发者图谱

摘要：为了便于您更清晰的理解的体系架构，在这里我将为您展示年开发者知识图谱，它包含了所有开发过程中的关键部分。在数据展示前端导入导出图表面板数据绑定等场景无需大量代码开发和测试，可极大节省企业研发成本并降低交付风险。作为 Vue 的初学者，您或许已经听过很多关于它的专业术语了，例如：单页面应用程序、异步组件、服务器端呈现等，您可能还听过和Vue经常一起被提到的工具和库，如Vuex、Webp...

cgspine 2019-08-23 18:14 评论0 收藏0
纯干货分享：如何在 React 框架中使用SpreadJS

摘要：作者葡萄城控件最好的功能之一就是能够在不同的框架中使用它。本文将演示如何在简单的页面中使用编译器将与快速结合。这只是和的基本使用，但可以轻松扩展。自面世以来，备受华为中通中国民航飞行学院中国平安中国能建浪潮等国内知名企业客户青睐。作者：葡萄城控件SpreadJS最好的功能之一就是能够在不同的框架中使用它。本文将演示如何在简单的Web页面中使用Babel JavaScript编译器将S...

Lin_R 2019-08-22 17:29 评论0 收藏0
用WijmoJS玩转您的Web应用 —— React

摘要：关于作为一款纯前端控件集，秉承快如闪电，触控优先的设计理念，在提供优质服务和产品的同时，专注于企业应用开发，不断优化产品架构，与时俱进。灵活的为用户提供易用轻松的操作体验，全面满足开发所需，是构建企业应用程序最完整的纯前端控件集。前文回顾在《用 WijmoJS 玩转您的Web应用》系列文章中，我们已经介绍了Angular和Vue框架下 WijmoJS 的玩法。而今天，我们将展示如...

FleyX 2019-08-22 18:09 评论0 收藏0
2017年 JavaScript 框架回顾 -- 前端框架

摘要：年，已经成为了最受欢迎的前端框架。年前端框架情况上图显示了年月至年月的个月期间，各个框架的绝对受欢迎程度及其增长情况。葡萄城公司成立于年，是全球领先的集开发工具商业智能解决方案管理系统设计工具于一身的软件和服务提供商。概述：对于 JavaScript 社区来说，npm 的主要功能之一就是帮助开发者发掘所需的 npm Registry 中的库和框架。npm 强大的搜索功能能够帮助找到...

huashiou 2019-08-22 13:52 评论0 收藏0