spreadjs 自定义 cellType 问题

Derrick.Jiao

本帖最后由浩于 2021-9-3 11:34 编辑

复制代码

AutoWrapTextCellType.prototype = new GC.Spread.Sheets.CellTypes.Text();
AutoWrapTextCellType.prototype.paint = function (ctx, value, x, y, w, h, style, context) {
ctx.font = style.font;
GC.Spread.Sheets.CellTypes.Text.prototype.paint.apply(this, [ctx, value, x, y, w, h, style, context]);
};

复制代码

自定义单元格类型后，会导致插入时插入整行数据

Derrick.Jiao · Derrick.Jiao

浩发表于 2021-9-3 16:52
中间有一些我们封装的代码，已替换

请问这是您想要的效果吗
image.png968458251.png

请把行列索引改为数字格式，也就是将上面的引号删除
image.png480890502.png

如果不符合您的需求，麻烦您再详细描述一下您的需求。

Derrick.Jiao · Derrick.Jiao

您好，请问您是指红框部分的数据吗？这边看了您的代码未能复线您的问题，请问您点击按钮的逻辑具体是什么呢？如果只是改变一个单元格的类型那么只会改变设置的单元格而不会影响其他单元格。建议您提供更多能复现问题的信息或者提供一个能复现问题的demo。
image.png699447021.png

浩 · 浩

本帖最后由浩于 2021-9-3 14:43 编辑

Derrick.Jiao 发表于 2021-9-3 14:16
您好，请问您是指红框部分的数据吗？这边看了您的代码未能复线您的问题，请问您点击按钮的逻辑具体是什么呢 ...

这个例子可以看到问题

const data = {
"0":{
"15,1":{
"row":"15",
"col":"1",
"mapping_value":"sign_one::一级签字",
"value":"管理员",
"old_text":""
},
"16,1":{
"row":"16",
"col":"1",
"mapping_value":"sign_one_time::一级签字日期",
"value":"2021年09月03日",
"old_text":""
}
}
};
_.forOwn(data, (item, pageIndex) => {
const sheet = $.spread.getSheetObjForIndex(pageIndex)
_.forOwn(item, (cellData) => {
const key = cellData['mapping_value'].split('::')[0];
const keyValue = cellData['mapping_value'].split('::')[1];
let {row, col, old_text, value} = cellData;
row = parseInt(row) + parseInt(sheet.getRowCount()) - parseInt(this.tempSheetJson[pageIndex]['rowCount']);
const old = old_text.replace(new RegExp(" ", "gm"), ' ');
if ($.common.isEmpty(value)) value = '';
let style = $.sheet.getStyle(row, col, sheet); // 获取样式
style.backColor = null; // 清空背景色
style.wordWrap = true; // 自动换行
sheet.getCell(row, col).text(old + value).cellType(new AutoWrapTextCellType());
sheet.setStyle(row, col, style, GC.Spread.Sheets.SheetArea.viewport);
})
})

复制代码

function AutoWrapTextCellType() {
}
AutoWrapTextCellType.prototype = new GC.Spread.Sheets.CellTypes.Text();
AutoWrapTextCellType.prototype.paint = function (ctx, value, x, y, w, h, style, context) {
ctx.font = style.font;
value = wrapString(ctx, value, w - 15);
GC.Spread.Sheets.CellTypes.Text.prototype.paint.apply(this, [ctx, value, x, y, w, h, style, context]);
};
function wrapString(c, str, maxWidth) {
let width = c.measureText(str).width;
if(width<=maxWidth) return str;
const len = str.length;
let newStrList = [];
let index = 0;
for (let i = 0; i < len; i++) {
// 临时拼接字符串
let _newStr = newStrList[index] + str[i];
// 临时拼接字符串的长度
let newWidth = c.measureText(_newStr).width;
// 初始化数组
if(!newStrList[index]) newStrList[index] = '';
// 长度判断
if(newWidth >= maxWidth){ // 长度超过,换行
newStrList[index] = newStrList[index] + '\n';
index++;
newStrList[index] = str[i];
}else{
newStrList[index] = newStrList[index] + str[i];
}
}
return newStrList.join('');
}

复制代码

Derrick.Jiao · Derrick.Jiao

浩发表于 2021-9-3 14:39
这个例子可以看到问题

暂时从您的代码中未能复现您的问题，这边已将您提供的代码以及json整理在一个demo里面，麻烦您在附件的dmeo中复现您的问题方便我们更快速地定位问题。

浩 · 浩

Derrick.Jiao 发表于 2021-9-3 16:19
暂时从您的代码中未能复现您的问题，这边已将您提供的代码以及json整理在一个demo里面，麻烦您在附件的dm ...

中间有一些我们封装的代码，已替换

浩 · 浩

Derrick.Jiao 发表于 2021-9-3 17:29
请问这是您想要的效果吗

谢谢，已解决

Derrick.Jiao · Derrick.Jiao

浩发表于 2021-9-3 17:49
谢谢，已解决

解决了就好，有新问题欢迎开新帖交流~

		自动登录	找回密码
密码			立即注册

[已处理] spreadjs 自定义 cellType 问题