如何使用前端表格控件实现多数据源整合？

前言

作为表格产品的典型应用场景之一，几乎所有的行业都会存在类 Excel 报表开发这样的应用场景，而在这些应用场景中，经常会遇见下面的这些痛点：

  1. 报表数据往往来自多个不同的数据源，需要报表系统能够同时连接多个数据源，并融合不同的数据格式

  2. 实际的报表中需要对数据结果进行逻辑计算，例如销售的环比和同比、渠道的排名、分类的占比等等

今天小编就将为大家介绍一下如何使用葡萄城纯前端表格控件 SpreadJS 的报表插件实现多源数据的整合，并实现相应的逻辑计算。

环境准备

SpreadJS在线表格编辑器：

SpreadJS 新版本新增了一款报表插件，该插件基于 SpreadJS 本身强大的表格能力，在 DataManager 数据关系引擎的助力下，全新的报表插件让报表和数据录入用户有了全新的能力和体验，快速完成报表和数据录入功能的搭建，相对之前，能节省大量的开发成本，此外，报表 还支持数据输入、分页、数据筛选、排序、条件格式化等功能。

实现步骤

在介绍完报表插件之后，接下来小编将为大家详细介绍如何通过报表插件将多个数据源融合起来。

一、数据集准备

数据源的数据模型如下图所示：

二、dataManager设置数据源

前面小编给大家说过，报表插件借助 dataManager 可以实现连接数据源，完成报表的数据能力。

接下来小编就给大家介绍一下如何在 dataManager设置数据源，目前 dataManager 有三种方式设置数据源：分是HTTP请求、本地数据data和本地json文件。

1、HTTP请求

现有一个http请求,在浏览器中打开，结果如下：

接下来小编需要通过DataManager添加这个http请求：1、打开 SpreadJS 在线表格编辑器，如下图所示，依次点击”数据“---->”数据源“---->”添加表“，在读取input框中，粘贴复制的链接。

2、修改 tableName ,将此修改为”GDP“。3、点击”列“，发现获取了此接口的字段”description“，”length“，”data“ ，不是需要的数据。

4、返回”表“，可以设置数据路径，输入data。

5、再次点击”列“ ，已经有了需要的字段信息。

至此，dataManager 已经设置好了数据源。我们可以根据此数据源，添加集算表或者报表，如下所示：

上面这种是使用可视化（无需编码）的方式添加http 请求的添加数据源。

除此之外，SpreadJS还支持代码获取请求，介绍下如何通过代码的方式添加url数据源，通过借助addTable接口实现添加：

 spread.dataManager().addTable('GDP', {
            remote: {read: {url: 'https://cdn.grapecity.com.cn/spreadjs/json-sample-data/cityGDPData.json'}},
            schema: {dataPath: 'data'}
        });

<!doctype html>
<html style="height:100%;font-size:14px;">
<head>
    <title></title>
    <meta charset="utf-8"/>

    <link href="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/css/gc.spread.sheets.excel2013white.17.0.2.css"
          rel="stylesheet" type="text/css"/>
    <link href="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/css/gc.spread.sheets.designer.17.0.2.min.css"
          rel="stylesheet"
          type="text/css"/>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/gc.spread.sheets.all.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.print.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.shapes.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.charts.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.barcode.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.pdf.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.pivot.pivottables.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.slicers.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.tablesheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.ganttsheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.formulapanel.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.io.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.report.reportsheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/scripts/gc.spread.sheets.designer.resource.cn.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/scripts/gc.spread.sheets.designer.all.17.0.2.min.js"></script>
    <script src="https://cdn.grapecity.com.cn/spreadjs/scripts/jquery-1.11.1.min.js" type="text/javascript"></script>
</head>
<body>
<div id="gc-designer-container" style="width:100%; height: 1000px"></div>

</body>

</html>
<script type="text/javascript">
    window.onload = function () {
        const designer = new GC.Spread.Sheets.Designer.Designer(document.getElementById("gc-designer-container"));
        const spread = designer.getWorkbook()

        spread.dataManager().addTable('GDP', {
            remote: {read: {url: 'https://cdn.grapecity.com.cn/spreadjs/json-sample-data/cityGDPData.json'}},
            schema: {dataPath: 'data'}
        });

    };

</script>

2、本地数据data

接下来介绍，如果通过本地数据，添加数据源。如果要通过本地数据data的方式添加数据源，需要通过代

码的方式，简单的代码如下：

完整代码如下：

 <!doctype html>
<html style="height:100%;font-size:14px;">
<head>
    <title></title>
    <meta charset="utf-8"/>

    <link href="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/css/gc.spread.sheets.excel2013white.17.0.2.css"
          rel="stylesheet" type="text/css"/>
    <link href="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/css/gc.spread.sheets.designer.17.0.2.min.css"
          rel="stylesheet"
          type="text/css"/>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/gc.spread.sheets.all.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.print.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.shapes.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.charts.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.barcode.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.pdf.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.pivot.pivottables.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.slicers.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.tablesheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.ganttsheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.formulapanel.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.io.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.report.reportsheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/scripts/gc.spread.sheets.designer.resource.cn.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/scripts/gc.spread.sheets.designer.all.17.0.2.min.js"></script>
    <script src="https://cdn.grapecity.com.cn/spreadjs/scripts/jquery-1.11.1.min.js" type="text/javascript"></script>
</head>
<body>
<div id="gc-designer-container" style="width:100%; height: 1000px"></div>

</body>

</html>
<script type="text/javascript">
    window.onload = function () {
        const designer = new GC.Spread.Sheets.Designer.Designer(document.getElementById("gc-designer-container"));
        const spread = designer.getWorkbook()
        let data  = [
            {id: 1,name: "张三", age: 27,  sex: 0},
            {id: 2,name: "李四", age: 31,  sex: 1},
            {id: 3,name: "小王", age: 22,  sex: 1},
            {id: 4,name: "小韩", age: 45,  sex: 0},
            {id: 5,name: "小明", age: 25,  sex: 0},
        ];
        const ordersTable = spread.dataManager().addTable('person', {data});



    };


</script>

上述代码，通过addTable创建table ，其中tableName是‘person’，数据是data。我们在页面上看一下。

观察上图，我们依次点击”数据“---->”数据源“ ，发现已经有了一个person表，而且读取的input是置灰不允许编辑的，此时点击下”列“，看下字段信息

发现此时已经成功加载了字段信息，同样的，我们在添加数据源table后，可以创建集算表或者报表，如下动图所示：

上面的例子是data的普通用法，我们看一下高级用法，导入json文件

3、本地json文件

如下图所示比，如何导入本地的Json文件呢？

首先，创建一个form表单，用来上传json文件：

<div class="inputContainer">
    <input type="file" id="fileDemo" class="input">
    <input type="button" id="loadData" value="导入json数据" class="button">
</div>

其次，设计按钮点击事件

document.getElementById('loadData').addEventListener('click', function () {
var file = document.querySelector('#fileDemo').files[0];
if (!file) {
return;
}
let reader = new FileReader();
reader.readAsText(file, "UTF-8");
reader.onload = function (evt) {
let result = JSON.parse(evt.target.result)
};
reader.onerror = function (error) {
console.log(error);
};
})

在上述代码中，我们解析了上传的json文件，得到result 。接下来，我们将result 放到dataManager中

reader.onload = function (evt) {
                let result = JSON.parse(evt.target.result)

                if (spread.dataManager().tables[fileName]) {
                    spread.dataManager().removeTable(fileName);
                }
                const ordersTable = spread.dataManager().addTable(fileName, {data: result});
                if (result.length > 0) {
                    initReportSheet(ordersTable, result[0])
                }

在上述代码中，我们添加了Orders表 ，其data数据为json文件中解析的数据，看一下实际结果同样的，依次点击”数据“---->”数据源“ ，发现已经有了一个Orders表，而且读取的input是置灰不允许编辑的

此时点击下”列“，看下字段信息

完整过程如下图所示：

完整代码：

<!doctype html>
<html style="height:100%;font-size:14px;">
<head>
    <title></title>
    <meta charset="utf-8"/>

    <link href="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/css/gc.spread.sheets.excel2013white.17.0.2.css"
          rel="stylesheet" type="text/css"/>
    <link href="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/css/gc.spread.sheets.designer.17.0.2.min.css"
          rel="stylesheet"
          type="text/css"/>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/gc.spread.sheets.all.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.print.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.shapes.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.charts.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.barcode.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.pdf.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.pivot.pivottables.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.slicers.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.tablesheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.ganttsheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.formulapanel.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.sheets.io.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/plugins/gc.spread.report.reportsheet.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/scripts/gc.spread.sheets.designer.resource.cn.17.0.2.min.js"></script>
    <script src="https://demo.grapecity.com.cn/spreadjs/v17.0-reportsheet/scripts/designer-lib/scripts/gc.spread.sheets.designer.all.17.0.2.min.js"></script>
    <script src="https://cdn.grapecity.com.cn/spreadjs/scripts/jquery-1.11.1.min.js" type="text/javascript"></script>
</head>
<body>
<div class="inputContainer">
    <input type="file" id="fileDemo" class="input">
    <input type="button" id="loadData" value="导入json数据" class="button">
</div>
<div id="gc-designer-container" style="width:100%; height: 1000px"></div>

</body>

</html>
<script type="text/javascript">
    window.onload = function () {
        const designer = new GC.Spread.Sheets.Designer.Designer(document.getElementById("gc-designer-container"));
        const spread = designer.getWorkbook()

        document.getElementById('loadData').addEventListener('click', function () {
            var file = document.querySelector('#fileDemo').files[0];
            if (!file) {
                return;
            }
            let fileName = file.name.split('.')[0]
            let reader = new FileReader();
            reader.readAsText(file, "UTF-8");
            reader.onload = function (evt) {
                let result = JSON.parse(evt.target.result)
                if (spread.dataManager().tables[fileName]) {
                    spread.dataManager().removeTable(fileName);
                }
                spread.dataManager().addTable(fileName, {data: result});
                alert('设置完成')
            };
            reader.onerror = function (error) {
                console.log(error);
            };
        })
    };
</script>

此外，还可以选择多个json文件，如下动图所示：

三、导入数据源

依次点击“数据”，“数据源”，发现已经导入了数据源，如下图所示：

四、设置模板

依次点击“插入”，“报表”，可以看得到左侧有数据源列表：

1、设置订单编号

首先将“订单”表的“订单编号”拖拽至A2单元格，

然后依次点击“报表设计”，“预览”查看结果。结果如下：

我们观察上图，只有订单编号信息，我们接着设置模板

2、设置门店

先将”门店“表的“商店名称”拖拽至B2单元格 ，

此时点击“预览”，发现“订单编号”与“商店名称”不存在对应关系，

接下来，我们选中A2单元格，选择“面板”进行过滤，然后在右侧的单元格属性中设置“过滤”条件，为

具体过程如下动图所示：

这样，便实现了订单与门店的对应关系：

接下来，添加订单明细数据

3、设置订单详情

将”订单明细“表中的”商品编号“，”订单单价“，”购买数量“ 依次拖拽进C2、D2、E2单元格。并且选中A2单元格，选择“面板”进行过滤，然后在右侧的单元格属性中设置“过滤”条件，如下图所示：

结果如下：

然后为报表添加下边框和样式，如下动图所示：

显示效果如下：

接下来，我们获取”商品信息“表，将”商品名称“添加至我们的报表中

4、设置商品名称

我们选中D列，然后右键，点击”插入“，此时有新增的一列。

我们将”商品信息“表的”商品名称“添加至D2单元格，选中C2单元格，即”商品编号“单元格，此时设置过滤条件

接下来，点击”预览“看下结果：

我们看到”商品编号“已经和”商品名称“一一对应，我们接下来调整下商品名称的列宽，并添加列头。

结果如下：

接下来，我们添加商品分类

5、设置商品类别

我们选中E列 ，然后右键，点击”插入“，此时有新增的一列。

我们将”商品分类“表的”小类名称“添加至E2单元格，选中D2单元格，即”商品名称“单元格，此时设置过滤条件

显示结果如下所示：

我们看到，商品名称和类别是一一对应的 ，我们的设置是正确的，同样，调整下样式。

接下来，我们看到当前模板有”单价“，”购买数量“，没有金额，我们添加下计算列

6、添加金额

我们为H2单元格设置公式 “=F2*G2” ，并设置样式

结果如下：

我们观察到上面的数据存在多位小数的情况，所以设置下单元格格式，右键，选择“设置单元格格式”

为“金额”单元格设置货币格式，结果如下：

看到这张报表，总觉得缺点什么，对了，缺订单小计。

接下来，我们设计下订单小计

7、设置订单小计

我们合并A2,A3单元格，合并B2,B3单元格,合并C3:G3单元格，在H3单元格中设置公式“=SUM(H2)”

操作过程如下动图所示：

显示效果如下：

至此，多数据源的报表就制作完成了。

文章转载自：葡萄城技术团队

原文链接：https://www.cnblogs.com/powertoolsteam/p/18215879

体验地址：引迈 - JNPF快速开发平台_低代码开发平台_零代码开发平台_流程设计器_表单引擎_工作流引擎_软件架构

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：/a/664652.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

数字化转型推动生物技术企业增长—纷享销客与集萃药康共探新动力

数字化转型推动生物技术企业增长—纷享销客与集萃药康共探新动力

上周&#xff0c;在南京锦创书城&#xff0c;一场主题为“生物技术企业增长新动力&#xff1a;以客户为中心的数字化转型与创新”的研讨会圆满落幕。此次活动由纷享销客江苏分公司联合江苏集萃药康生物科技股份有限公司共同举办&#xff0c;吸引了众多生物技术领域企业的负责人…
阅读更多...
华媒舍：10种欧洲地区媒体发稿推广技巧

华媒舍：10种欧洲地区媒体发稿推广技巧

1.了解欧洲地区媒体自然环境必须掌握欧洲地区媒体的发稿推广方法&#xff0c;首先要对欧洲地区媒体自然环境有一定的了解。包含不一样国家的主力媒体&#xff0c;他的阅读者人群、销售市场遮盖及其报导风格等。仅有熟悉媒体自然环境&#xff0c;才能更好的制订营销推广策略。 …
阅读更多...
电容、电阻、二极管和三极管的分类

电容、电阻、二极管和三极管的分类

目录 一、电容 1、符号 2、关键参数 &#xff08;1&#xff09;容值 &#xff08;2&#xff09;封装 &#xff08;3&#xff09;精度 &#xff08;4&#xff09;耐压值&#xff08;额定电压&#xff09; 3、作用 &#xff08;1&#xff09;储能 &#xff08;2&#xff…
阅读更多...
使用opencv 进行车牌位置检测的源代码

使用opencv 进行车牌位置检测的源代码

效果： 这一个车牌识别系统中的预处理函数，其主要目的是对输入的车牌图片进行一系列的图像处理操作，以便后续的车牌识别算法能够更准确地识别出车牌。 整个函数的流程是：读取图像 -> 缩放 -> 灰度化 -> 去噪 -> 边缘检测 -> 形态学操作 -> 轮廓检测 ->…
阅读更多...
SQL数据库多表创建之一对多、多对多表创建

SQL数据库多表创建之一对多、多对多表创建

MySQL多表创建关联及操作_mysql创建关联表-CSDN博客文章浏览阅读1.1k次&#xff0c;点赞21次&#xff0c;收藏20次。表与表之间的关系表语表之间的关系&#xff0c;说的就是表与表数据之间的关系。_mysql创建关联表https://blog.csdn.net/2401_83641392/article/details/137031…
阅读更多...
苍穹外卖数据可视化

苍穹外卖数据可视化

文章目录 1、用户统计2、订单统计3、销量排名Top10 1、用户统计 所谓用户统计&#xff0c;实际上统计的是用户的数量。通过折线图来展示&#xff0c;上面这根蓝色线代表的是用户总量&#xff0c;下边这根绿色线代表的是新增用户数量&#xff0c;是具体到每一天。所以说用户统计…
阅读更多...
谷歌上架，可以用云手机来完成开发者个人号“20+14”封测？

谷歌上架，可以用云手机来完成开发者个人号“20+14”封测？

根据谷歌的政策要求&#xff0c;自2023年11月13日之后创建的个人开发者账号&#xff0c;其应用必须满足20人连续14天封闭测试的要求&#xff0c;才能在Google Play 中上架正式版应用。 20人连续测试14天&#xff0c;这对大多数开发者&#xff0c;尤其是那些采用矩阵方式上架的开…
阅读更多...
变现实谈，我要的不是灵光一现，而是真实的实现!——感悟篇

变现实谈，我要的不是灵光一现，而是真实的实现!——感悟篇

变现要的是行动不是想法 正文时代奇点奇迹 点题以己及人 正文 每当我看到了一个有趣的事情 我会在脑中构思一些想法 会贴合我当下的想要做的事情 比如 在我写下这篇文章之前 我看到了 二战期间的诞生的一个奇迹 可口可乐 我就思考 咦 原来可口可乐居然是在这么个时间点成长…
阅读更多...
Vue.js2+Cesium1.103.0 十六、多模型轨迹运动

Vue.js2+Cesium1.103.0 十六、多模型轨迹运动

Vue.js2Cesium1.103.0 十六、多模型轨迹运动 Demo <template><div id"cesium-container" style"width: 100%; height: 100%;"><ul class"ul"><li v-for"(item, index) of deviceInfo" :key"index" cl…
阅读更多...
SqlServer还原系统库步骤及问题解决

SqlServer还原系统库步骤及问题解决

还原master 需要切换到binn目录 Cd C:\Program Files\Microsoft SQL Server\MSSQL10_50.MSSQLSERVER\MSSQL\Binn 关闭服务 用单用户模式启动 SQL Server 默认实例 sqlservr.exe -m 直接单用户登录 恢复master备份文件 RESTORE DATABASE master FROM DISK E:\dbbak\txic_ke…
阅读更多...
低代码与人工智能的深度融合：行业应用的广泛前景

低代码与人工智能的深度融合：行业应用的广泛前景

引言 在当今快速变化的数字化时代&#xff0c;企业面临着越来越多的挑战和机遇。低代码平台和人工智能技术的兴起&#xff0c;为企业提供了新的解决方案&#xff0c;加速了应用开发和智能化转型的步伐。 低代码平台的基本概念及发展背景 低代码平台是一种软件开发方法&#x…
阅读更多...
Golang | Leetcode Golang题解之第119题杨辉三角II

Golang | Leetcode Golang题解之第119题杨辉三角II

题目&#xff1a; 题解&#xff1a; func getRow(rowIndex int) []int {row : make([]int, rowIndex1)row[0] 1for i : 1; i < rowIndex; i {row[i] row[i-1] * (rowIndex - i 1) / i}return row }
阅读更多...
python基础-数据结构-int类型——你知道python的最大整数是什么吗？无限大？还是sys.maxsize?

python基础-数据结构-int类型——你知道python的最大整数是什么吗？无限大？还是sys.maxsize?

文章目录 int底层源码最大整数推断 int底层源码 python 的int类型貌似并没有一个位数上线&#xff0c;然而我们知道其他语言的整数都是有位数&#xff0c;一般为32位或者64位等&#xff0c;那么python是怎么实现int类型没有位数限制的呢&#xff0c;下面这段代码是cpython仓库…
阅读更多...
ams仿真将一组输出波形转化为所对应的十进制code

ams仿真将一组输出波形转化为所对应的十进制code

virtuoso ADE XL ams仿真将一组输出波形转化为所对应的十进制code 选中一组波形 输入波形翻转电压&#xff0c;起个名字
阅读更多...
复习leetcode第二题：两数相加

复习leetcode第二题：两数相加

本文会给出笔者自己的解答&#xff08;代码较为冗余&#xff0c;其实就是屎山代码&#xff09;以及优秀代码的解析 下图是题目 解法1&#xff08;笔者所使用的办法&#xff09;&#xff1a; 解题思路&#xff1a; 以下思路是基于示例1&#xff08;上图&#xff09;思考的 步骤…
阅读更多...
【JS红宝书学习笔记】第6章 集合引用类型

【JS红宝书学习笔记】第6章 集合引用类型

第6章 集合引用类型 对象 数组与定型数组 Map、WeakMap、Set 以及 WeakSet 类型 1. object 很适合存储和在应用程序间交换数据。 显式创建object的两种方式&#xff1a; &#xff08;1&#xff09;new操作符 let person new Object(); person.name "Nicholas";…
阅读更多...
nginx的安装001

nginx的安装001

Nginx是一款高性能的HTTP和反向代理服务器&#xff0c;以及邮件代理服务器&#xff0c;由 Igor Sysoev 开发并公开发布于2004年。Nginx以其高并发处理能力、低内存消耗和稳定性著称&#xff0c;特别适合部署在高流量的网站上。 操作系统&#xff1a; CentOS Stream 9 安装步骤…
阅读更多...
CentOS7配置国内清华源并安装docker-ce以及配置docker加速

CentOS7配置国内清华源并安装docker-ce以及配置docker加速

说明 由于国内访问国外的网站包括docker网站&#xff0c;由于种种的原因经常打不开&#xff0c;或无法访问&#xff0c;所以替换成国内的软件源和国内镜像就是非常必要的了&#xff0c;这里整理了我安装配置的基本的步骤。 国内的软件源有很多&#xff0c;这里选择清华源作为…
阅读更多...
官方小游戏项目

官方小游戏项目

一 项目原理&#xff1a;看广告&#xff0c;操作简单&#xff0c;时间自由&#xff0c;适合利用业余时间来做&#xff0c;一个广告大概在15s-30s之间。 二 介绍&#xff1a;给你开代理权限&#xff0c;你就有独立后台管理系统&#xff0c;监测每台手机每条广告的情况&#xff0…
阅读更多...
案例研究｜MeterSphere助力万物云构建高效自动化测试平台

案例研究｜MeterSphere助力万物云构建高效自动化测试平台

万物云空间科技服务股份有限公司&#xff08;以下简称为“万物云”&#xff09;&#xff0c;前身为万科物业发展股份有限公司&#xff0c;是国内领先的物管龙头上市公司。作为一家科技引领的全域空间服务商&#xff0c;万物云致力于打造产业级共享服务平台&#xff0c;基于空间…
阅读更多...
最新文章

Copyright @ 2022~2023