从零开始学习wpsjs

蜂巢糖FCT

已于 2023-10-30 16:01:58 修改

阅读量1.3k

点赞数 1

文章标签： vue.js wps 1024程序员节

于 2023-10-24 10:02:27 首次发布

本文链接：https://blog.csdn.net/qq_36093530/article/details/134005211

版权

1.这是一个简单的wpsjs学习文档，我是边学习wpsjs边记录学习的，希望对您的学习有所帮助

开发事项：

全局安装wpsjs:npm install -g wpsjs
Wpsjs create HelloWps

安装wps

npm install -g wpsjs

新建一个wps加载项

输入命令wpsjs create HelloWps, 会出现以下几个选项：

文字，演示，电子表格，这里选择电子表格(需注意：你选择了何种类型选项只会对选中的类型的文件起作用，这里选择了电子表格只会对xls,xlsx类型文件起作用)

选择示例代码的代码风格类型

wpsjs工具包提供了两种不同代码风格的示例，“无”代表示例代码中都是原生的js及html代码，没有集成vue/react等留下==流行的前端框架。 Vue"代表生成的示例代码集成了Vue相关的脚手架，在实际的项目中选用Vue基于示例代码可能更适合做工程化的开发，感兴趣的同学可以两种都尝试一下。
这里我们选择“vue”，按Enter健确认。
确认后wpsjs工具包会在当前目录下生成一个HelloWps的文件夹

使用vscode打开文件夹HelloWps

运行，输入终端命令

wpsjs debug

打包部署可参考：https://club.excelhome.net/thread-1671577-1-1.html

打包

wpsjs build

选择离线模式 wps-addon-build目录下生成压缩包文件，如果是在线模式则会生成普通文件目录

离线和在线的方式各有优缺点：

在线插件 ——

优点：加载比较平滑，用户首次加载或版本更新后的用户初次访问时间会比离线模式高，且每次都是使用最新的代码

缺点：每次执行时，都是去请求服务器上的资源，比较浪费网络资源，并且网络不好时，不能访问。

总结：在线模式适合在资源频繁改动，且网络稳定的情况下使用

离线插件 ——

优点：只要 name_version 等于加载项文件夹的名字，加载项就不会去更新加载项的包，采用本地的加载项包资源，大大的节省网络资源和用户的时间。

缺点：初次加载或版本变更时，都会先去下载整个加载项包，并解压，会比较耗费时间

总结：离线模式适合资源改动不频繁的情况

部署

wpsjs publish

部署成功后随便打开一个表格文件，然后点击publish.html运行，出现下图则说明部署成功

若出现访问publish.html无显示加载项配置：

查看wps office是否未账号登录
查看路径C:\Users\Administrator\AppData\Roaming\kingsoft\wps\jsaddons是否配置解压缩包

若出现加载项安装完成，但是wps office没有显示加载项：

1.是否压缩包已经解压缩到C:\Users\Administrator\AppData\Roaming\kingsoft\wps\jsaddons中了，注意版本号

表格 api:

当前excel文件名称：Application.ActiveWorkbook.Name ‘1.xls’
当前excel文件路径：Application.ActiveWorkbook.Path
当前工作表数目：Application.ActiveWorkbook.Worksheets.Count
当前sheet名称：Application.ActiveWorkbook.ActiveSheet.Name ‘sheet1’
新增sheet页,左侧添加：Application.Worksheets.Add();
右侧添加sheet页：Application.Worksheets.Add(undefined,Application.ActiveSheet).Name = “右侧表”
修改sheet页名称：Application.ActiveSheet.Name = 'ceshi';
激活sheet页：Application.Worksheets.Item('sheet1').Activate();
获取单元格对象：Application.ActiveSheet.Cells.Item(1,1)
当前选中所有的单元格对象：Application.Selection
当前选中单元格值：Application.Selection.Value2 ‘值’
当前选中单元格地址：Application.Selection.Address() ‘$A$1:$B$1’;
设置单元格值：Application.ActiveSheet.Range('A4').Value2 = 4 ‘A4为单元格索引’
设置单元格颜色：Application.Worksheets.Item("Sheet1").Range("A1").Font.Color = (0, 0, 255)
批量设置单元格值：Application.ActiveSheet.Range('A12:B13').Value2 = [[1,2],[3,4]];
批量设置单元格值：
Application.ActiveSheet.Range('A5').Resize(6, 2).Value2 = arr //从A5单元格开始，插入2行6列的数据，arr为二维数组
设置单元格批注：Application.ActiveSheet.Range('A5').AddComment = ‘aa55’
清除批注：Application.ActiveSheet.Range('A5').ClearComments();
批注添加背景图片：Application.ActiveSheet.Range('A5').Comment.Shape.Fill.UserPicture(`${Application.ActiveWorkbook.Path}\\img\\1.png`); // 批注添加背景图片 .\img\1.jpg
打开xls文件：Application.Workbooks.Open('D:\\Users\\Desktop\\aa\\22.xls');
选中A1：Application.ActiveSheet.Range('A1').Select();
选中A1-A5：Application.ActiveSheet.Range("A1" , "A5").Select();
选中以A1为起点的连续性非空白区域：Application.ActiveSheet.Range('A1').CurrentRegion.Select();
修改选中区域宽高： Application.Selection.RowWidth = 30; ‘RowHeight’
将选中的区域复制到D1:Application.Selection.Copy(Application.ActiveSheet.Range('D1'));
表格定位插入图片：Application.ActiveSheet.Shapes.AddPicture(‘https://bwipjs-api.metafloor.com/?bcid=code128&text=200534231&includetext=true&textsize=12&height=9’, true, true, 150, 20, 120, 50)
/*此示例将当前活动工作簿的 Sheet1 移到 Sheet3 之后。*/ Application.Worksheets.Item("Sheet1").Move(null, Application.Worksheets.Item("Sheet3"))