@ks-dbdev/template-react-db-record

@ks-dbdev/template-react-db-record

多维表格记录插件开发模板

🚀 快速开始

使用 CLI 创建项目（推荐）

# 使用 dbdev CLI 工具
npx @ks-dbdev/cli create template

# 或全局安装后使用
npm install -g @ks-dbdev/cli
dbdev create template

选择 "记录插件" 模板

📦 主要功能

本模板提供了 5 个示例功能，展示记录插件的常用能力：

1. Base Info（基础信息）

点击第一个按钮，可以查看当前单元格的基础信息。

2. Current Sheet Fields Meta（字段元数据）

点击第二个按钮，可以查看当前 Sheet 下的字段列表。

3. Sheets Meta List（表格列表）

点击第三个按钮，可以查看所有 Sheet 的信息。

4. Current Sheet View Meta（视图元数据）

点击第四个按钮，可以查看当前 Sheet 下的 View 列表信息。

5. Task Manager（任务管理器 Demo）

第五个按钮为一个 Demo 组件，展示如何绑定多个字段进行任务管理。当点击某一行的单元格时，可以对该行的任务进行管理。

⚠️ 注意：任务管理器需要绑定三个特定字段，字段 ID 必须与代码中要求的一致，否则不生效。

代码中的字段配置：

// 任务管理器绑定三个字段：任务描述、任务执行人、任务状态
const taskDescription = 'B'    // 绑定任务描述字段
const taskUserFieldId = 'O'    // 绑定执行人
const taskFieldId = 'F'        // 绑定是否完成字段

🛠️ 开发流程

1. 安装依赖

npm install

2. 本地调试

启动本地开发服务

打开项目目录终端，执行以下命令启动本地开发服务：

npm dev

命令执行后，终端会显示本地服务端口号（PORT），例如：5173

打开目标多维表页面

打开需要调试的多维表页面，并在 URL 后增加查询参数：?plugin_debug=PORT

示例如下：

• 基础模式：https://www.kdocs.cn/l/XXXXXXXXX?plugin_debug=5173
• 已含其他参数模式：https://www.kdocs.cn/l/XXXXXXXXX?R=XXXXXXXX&plugin_debug=5173

验证本地调试效果

页面刷新后，点击任意单元格打开记录插件面板，即可查看本地开发的插件效果。

💡 请确保本地开发服务（npm dev）处于运行状态，否则无法加载本地插件。

3. 打包插件

执行以下命令打包插件：

npm build

打包完成后，将 dist 文件夹压缩为 zip 包，即可上传到 WPS 开放平台。

📚 相关文档

• WPS多维表格记录卡片插件开发指南