效能工具之node在项目中的应用(一)

2023年 8月 29日 40.0k 0

问题描述

  • 常言道,敏捷开发...
  • 如何去敏捷开发呢?途径有很多,其中有一种就是去创造一些“工具”,使用工具提升开发效率
  • 比如,从最早的原生写法的HTML、CSS、JS,到后来的JQuery(工具)
  • 再到后来的ANGUALR、REACT、VUE框架(工具)
  • 包括一些UI组件库,WEBPACK、甚至是低代码平台都是一种工具
  • 本质上,就是让我们少写代码,也能实现想要的效果
  • 今天笔者就给大家抛砖引玉一下,希望诸位读者,读完以后,能够有所思考

案例场景

表格案例

我们知道,开发中比较常见的就是表格的展示,比如这样的:

111.png

我们平常开发项目的时候,常常会把表格进行二次封装,通过JSON配置化的形式,配置一下,指定一些参数和字段,就能够直接渲染出我们想要的效果了

代码大概是下面这样的

[
  {
    "propName": "name",
    "labelName": "姓名",
    "width": 90,
    "fixed": false,
    "isSort": false
  },
  {
    "propName": "age",
    "labelName": "年龄",
    "width": 90,
    "fixed": false,
    "isSort": false
  },
  {
    "propName": "home",
    "labelName": "家乡",
    "width": 90,
    "fixed": false,
    "isSort": false
  },
  {
    "propName": "remark",
    "labelName": "备注",
    "width": 90,
    "fixed": false,
    "isSort": false
  },
]
  • 开发中,自然是复制粘贴啦,然后去修改其对应的键值对的值
  • 那么,我们能不能自己搞一个工具,让我们少一些复制粘贴呢?
  • 有的朋友问道,表格只有三五列,用得着,这么麻烦吗?
  • 笔者感叹,笔者曾遇到有100多列的表格的展示需求
  • 那总不能复制100多次吧
  • 那怎么样少点复制操作,甚至能够自动生成呢?

思路分析

  • 我们知道,表格展示的字段啥的,来自后端建表的时候,定义的字段名称
  • 所以,源头在哪里呢?就在数据库的表的结构里面啊
  • 我们打开数据库,设计表、查看表结构,是能够看到什么字段,以及相应的信息的,如下图

222.png

什么字段对应什么意思,正常来说,都会写在字段的注释里面的

  • 也就是说,一个字段,有一个字段的注释,相对应的,也就是propNamelabelName
  • 那这就好办了,我们直接导出这个表的结构,就可以看到对应关系了,如下操作

333.png

  • 导出的table.sql文件代码如下:
/*
 Navicat Premium Data Transfer

 Source Server         : lss
 Source Server Type    : MySQL
 Source Server Version : 50562
 Source Host           : localhost:3306
 Source Schema         : xiyouji

 Target Server Type    : MySQL
 Target Server Version : 50562
 File Encoding         : 65001

 Date: 14/04/2021 08:56:05
*/

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;

-- ----------------------------
-- Table structure for peopletable
-- ----------------------------
DROP TABLE IF EXISTS `peopletable`;
CREATE TABLE `peopletable`  (
  `id` int(13) NOT NULL AUTO_INCREMENT COMMENT '唯一id',
  `name` varchar(255) CHARACTER SET utf8 COLLATE utf8_unicode_ci NULL DEFAULT NULL COMMENT '姓名',
  `age` int(11) NULL DEFAULT NULL COMMENT '年龄',
  `home` varchar(255) CHARACTER SET utf8 COLLATE utf8_unicode_ci NULL DEFAULT NULL COMMENT '家乡',
  `remark` varchar(255) CHARACTER SET utf8 COLLATE utf8_unicode_ci NULL DEFAULT NULL COMMENT '备注',
  `is_delete_status` tinyint(1) UNSIGNED NOT NULL DEFAULT 1 COMMENT '1正常、0删除',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 31 CHARACTER SET = utf8 COLLATE = utf8_unicode_ci ROW_FORMAT = Compact;

SET FOREIGN_KEY_CHECKS = 1;
  • 我们看上述代码,就能明白,我们想要的东西,从第24行开始到32行结束,中的CREATE TABLE创建表格的内容的,对应字段以及此字段的注释COMMENT的名字,结束的ENGINE = InnoDB AUTO_INCREMENT
  • 而,我们又知道,所谓的导出的.sql文件其内容不过就是一堆字符串罢了,毕竟我们使用node的文件读取api能够拿到其对应字符串内容。如下
fs.readFile('./table.sql', 'utf-8', (err, data) => {
    console.log('读取到的内容是字符串',data)
})
  • 所以,当我们拿到了字符串以后,就可以对字符串进行“加工”,比如找到对应关键字、进行提取、截取、分离、加工组装成我们所需要的JSON数组格式
  • 至于怎么加工的,笔者给大家提供了,一些代码,以供参考
const fs = require('fs');

let tableHeader = []

// 判断是不是大写字母
function isUpLetter(str) {
    var strCode = str.charCodeAt()
    return strCode >= 65 && strCode  {
        if (err) {
            console.log(`失败了${err}`)
        }
        console.log('tableHeader导出成功');
    })
}
// 读取sql文件并加工成前端需要的格式
fs.readFile('./table.sql', 'utf-8', (err, data) => {
    let articalArr = data.split('n') // 使用换行符分隔成数组
    let startLineIndex; // 开始行索引
    let end; // end标识找到结束位置(结束位置再往上走几行才是prop、label结束位置)
    articalArr.forEach((item, index) => {
        if (item.includes('CREATE TABLE')) {
            startLineIndex = index
        }
        if (item.includes('ENGINE')) {
            end = index
        }
    })
    startLineIndex = startLineIndex + 1 // 此行包含CREATE TABLE,再下一行才是真正prop、label数据
    let endLineIndex = findPropEndLine(articalArr, end) // end标识不停往上走,直到不是大写字母
    const propLabelArr = articalArr.slice(startLineIndex, endLineIndex + 1) // 截取真正使用范围
    /**
     * 遍历拿到prop和label,这才是真正的前端表头需要的数据值
     * */
    for (const item of propLabelArr) {
        let tableHeaderItem = {
            propName: getPropName(item),
            labelName: getLabelName(item),
            width: 90, // 定义默认值
            fixed: false, // 定义默认值
        }
        tableHeader.push(tableHeaderItem)
    }
    // 控制台输出复制粘贴使用
    console.log(tableHeader);
    // 导出成json文件使用
    exportJSON(JSON.stringify(tableHeader))
});
  • 使用的话,如下图:

444.png

实际示例

  • 为了更便于大家演示,笔者写了页面和接口,供大家看更直接的效果
  • ashuai.work/sql
  • 访问地址后,如下图操作即可

555.png

至此,我们就可以根据数据库中的表格字段,生成表格字段,假设一两百列很多字段的情况下,这种方式会不会减轻一下工作量呢?

总结

  • 很多时候,思路比代码更重要...
  • 希望本篇文章,能拓展一下大家的思路

相关文章

Oracle如何使用授予和撤销权限的语法和示例
Awesome Project: 探索 MatrixOrigin 云原生分布式数据库
下载丨66页PDF,云和恩墨技术通讯(2024年7月刊)
社区版oceanbase安装
Oracle 导出CSV工具-sqluldr2
ETL数据集成丨快速将MySQL数据迁移至Doris数据库

发布评论