关于#javascript#的问题：说明当前加载的sheet中并不存在该单元格，可能当前单元格被前边合并，这种被合并的单元格也得设置样式

Question

let workbook = XLSX.utils.table_to_book(document.getElementById('mytable'));
            // 先定义列宽 ， 我这里文件一共有7 列 ，所以设置7列宽度相等都为 20 ，如果你有很多列建议直接 map()
            let wscols = [
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 },
                { wch: 20 }
            ];
            // 获取 需要设置样式的 sheet ，我这里只有 一个 sheet 所以索引默认加载了第一个
            const sheet = workbook.Sheets[workbook.SheetNames[0]];
            // 设置列宽
            sheet['!cols'] = wscols;

            // 定义框线样式
            const borderAll = {
                color: { auto: 1 },
                top: {style: "thin"},
                bottom: { style: "thin"},
                left: { style: "thin" },
                right: { style: "thin" }
            };

            // 这里的意思为 先默认代表表格的 7 个列  的 列号
            // 比如 A2 意思是 第一列 第2行
            const _letterList = ['A', 'B', 'C', 'D', 'E', 'F', 'G','H','I','J','K','L']
            // 定义一个 箭头函数，接受三个参数，分别为 当前Sheet , 行列号（例如：‘A2’）, 是否是新增样式
            const _mapCellStyle = (_sheet, _key, _type) => {
                const _cellStyle = {
                    border: borderAll,
                    alignment: {
                        wrapText: true,
                        horizontal: "center",
                        vertical: "center"
                    },
                    font: {
                        name: "微软雅黑",
                        sz: 10
                    },
                    bold: true,
                    numFmt: "0"
                }

                if (_type === 'append') {
                    // 需要新增样式，说明当前加载的sheet中并不存在该单元格，可能当前单元格被前边合并，这种被合并的单元格也得设置样式，
                    // 否则就会出现 合并单元格只有第一格带框线，后边没框线的情况出现，所以这里需要将后边的边框样式也加上。
                    _sheet[_key] = {
                        s: _cellStyle
                    }
                } else {
                    // 若不是新增样式 则代表sheet中已存在该表格直接修改其 s 属性即可使属性生效
                    if (typeof _sheet[_key] === 'object') {
                        _sheet[_key].s = _cellStyle
                    }
                }
            }

            // sheet 不懂得可以单独打印一下，它其实就是一个对象，键代表行列号（‘A2’），值为该单元格的值，样式等，
            // 我们需要做的就是修改其值中的样式
            Object.keys(sheet).forEach((i, _) => {
                // 无用属性直接过滤
                if (i !== "!ref" || i !== "!cols" || i !== "!merges" || i !== "Am") {
                    // 首先设置遍历到的 当前 key
                    let _nowKey = i
                    // 然后调用 _mapCellStyle  渲染当前单元格样式
                    _mapCellStyle(sheet, _nowKey)
                    // 我们这里先获取下一个行列号  例如当前_nowKey 是 A1  这里就是获取到 B1 ,及 当前行的 下一列数据
                    let _nextKey = _letterList[_letterList.indexOf(_nowKey[0]) + 1] + i.slice(1)

                    // 判断 B1 是否在 Sheet的key中,如果不存在，只可能是因为B1所在单元格已经被A1所合并，所以我们需要将B1也调用一下  _mapCellStyle
                    // 渲染 B1 的样式，不然就会出现 A1 B1 这两格是合并的状态，只有A1有框线，而B1 没有框线的情况。
                    // 这里用 while 就是 要把需要合并的单元格全部 渲染上样式，直到可能 B4 在 Sheet中 停止
                    while (_nowKey[0] !== 'G' && !Object.keys(sheet).includes(_nextKey)) {
                        _mapCellStyle(sheet, _nextKey, 'append')
                        // 这里就是简单的交换索引
                        _nowKey = _nextKey
                        _nextKey = _letterList[_letterList.indexOf(_nowKey[0]) + 1] + _nowKey.slice(1)
                    }
                }
            })

            let wopts = {
                bookType: 'xlsx',
                bookSST: false,
                type: 'buffer',
            }
            console.log(workbook)
            console.log(wopts)
            let _blob = XLSX.write(workbook, wopts);

            window.saveAs(new Blob([_blob], {
                type: "application/octet-stream"
            }), "项目信息一张表.xlsx");

东西都调好了样式没效果求解

Answer 1

如果你想为一个被合并的单元格设置样式，需要先找到合并该单元格的原始单元格，然后为该原始单元格设置样式。

你可以使用JavaScript中的document.querySelector()或document.getElementById()方法来查找该原始单元格。一旦找到了原始单元格，你就可以为它设置样式了。

例如，假设你想为一个被合并的单元格设置背景颜色为黄色，你可以按照以下步骤进行操作：

使用document.querySelector()或document.getElementById()方法找到合并该单元格的原始单元格。

var originalCell = document.querySelector('#original-cell');

为原始单元格设置样式，例如设置背景颜色为黄色。

originalCell.style.backgroundColor = 'yellow';

请注意，如果原始单元格中已经设置了样式，则该样式可能会影响到合并该单元格的单元格。因此，在为合并单元格设置样式之前，最好检查原始单元格中是否已经设置了样式，并在必要时更新该样式。