bird-grid是bird-front前端框架中实现的全自动数据表格组件。组件内部处理数据加载、分页、排序、查询、新增、编辑等一系列操作。让业务表格的开发从繁复的增删查改中脱离出来,编码简洁却又功能强大。
功能特性
丰富的列类型支持,包括文本、文本域、数字、bool、下拉选择器、级联选择器、富文本、图片、日期、时间等类型。
新增、编辑零代码,支持自定义的编辑配置(提示、是否必填、正则验证等)。
查询、排序、分页零代码。每列均可查询、排序。
自定义操作按钮,默认提供新增、修改、删除的操作按钮。
组件内部支持按钮级权限控制。
示例代码
render() { let gridOption = { url: { read: "/sys/dic/getPaged", add: "/sys/dic/save", edit: "/sys/dic/save", delete: "/sys/dic/delete" }, columns: [ {title: "编号", data: "id", type: "number",}, {title: "字典名称", data: "name", type: "text", editor: {}, query: true}, {title: "Key", data: "key", type: "text", editor: {}, query: true}, {title: "默认业务码", data: "defaultCode", type: "text", editor: {}, query: true}, {title: "创建时间",data: "createTime",type: "datetime",query: true}, {title: "操作选项", type: "command", actions: []} ] }; return (<BirdGrid gridOption={gridOption}/>) }