请问s2DataConfig中，rows数组的长度可以设置吗？🤔

[annisFromchina]

🏷 Version

Package	Version
@antv/s2	2.0.0-next.24
@antv/s2-react	无
@antv/s2-vue	无

Sheet Type

• [ √] PivotSheet
• TableSheet
• GridAnalysisSheet
• StrategySheet
• EditableSheet

🖋 Description

请问s2DataConfig中，rows数组的长度可以设置吗？我自己测试了一下，只能前4个生效

🔗 Reproduce Link

s2DataConfig: {
fields: {
rows: ['department', 'departTopic', 'project','actualExe'],
columns: ['type'],
values: ['number'],
valueInCols: true,
},}

可以实现如下图所示的效果吗

😊 Expected Behavior

😅 Current Behavior

[lijinke666]

没有个数限制, 如不生效, 请提供在线的最小可复现 demo.

[github-actions]

你好 @annisFromchina，请提供一个可以在线访问的链接, 或者使用 codesandbox 提供示例并详细说明复现步骤 (查看更多模板), 15 天内未回复issue自动关闭。

Hello, @annisFromchina, please provide an accessible link or usage codesandbox to describe the reproduction steps (more template). The issue will be closed without any replay within 15 days.

[annisFromchina]

` <script>
import { PivotSheet, Aggregation, S2Event, asyncGetAllPlainData, copyToClipboard, download } from '@antv/s2'
// import { SheetComponent, SheetComponentOptions, Switcher } from 'ant-design-vue'

//这个是自适应窗口大小需要导入的组件
import { debounce } from 'lodash'

export default {
data() {
return {
split: '\t',
fileName: 'test',
selectedRows: [], // 用于存储X轴选中的值
selectedColumns: [], // 用于存储Y轴选中的值
row: String,
column: String,
test: {
fields: {
//定义了表格的行字段，这里是省份和城市
rows: [
{ id: '1', jia: 'department', china: '部门' },
{ id: '2', jia: 'departTopic', china: '业务部预算目标' },
{ id: '3', jia: 'budget', china: '预算指标' },
{ id: '4', jia: 'actualExe', china: '实际执行' },
{ id: '5', jia: 'completionRate', china: '完成率' },
{ id: '6', jia: 'project', china: '项目' },
],
//定义了表格的列字段，这里是商品类别
columns: [{ id: '3', jia: 'type', china: '类型' }],
//定义了用于聚合或显示的数值字段，这里是价格
values: ['number'],
},
},
mergeButton: false,
cancelButton: false,
button: document.createElement('button'),
pivotSheet: null,
s2DataConfig: {
fields: {
rows: ['department', 'project', 'budget','actualExe'],
columns: ['type'],
values: ['number'],
valueInCols: true,
},
//字段用于定义每个字段的元数据，比如字段的显示名称等
meta: [
{
field: 'number',
name: '金额',
},
{
field: 'year',
name: '年',
},
{
field: 'department',
name: '部门',
},
{
field: 'budget',
name: '预算指标',
},
{
field: 'actualExe',
name: '实际执行',
},
{
field: 'completionRate',
name: '完成率',
},

      {
        field: 'project',
        name: '项目',
      },
      {
        field: 'type',
        name: '类别',
      },
    ],
    //字段是一个数组，包含了表格的实际数据
    data: [
      {
        department: '物资供应(唐山)业务部',
        project: '改造钢筋供应项目',
        type: '利润总额',
      },
      {
        department: '物资供应(唐山)业务部',
        project: '改造钢筋供应项目',
        type: '利润总额',
        budget:'预算指标',
        number: 2.25,
      },
      {
        department: '物资供应(唐山)业务部',
        project: '改造钢筋供应项目',
        type: '利润总额',
        actualExe:'实际执行',
        number: 1.25,
      },
    ],
  },
  //用于定制表格的外观和行为
  s2Options: {
    width: 1400,
    height: 800,
    //设置表格的层级类型为树状结构。这通常意味着表格可能包含嵌套的层级数据，例如父子关系的数据
    hierarchyType: 'tree',
    //当鼠标悬停在表格的某个单元格上时，会显示一个包含该单元格详细信息的提示框。

    interaction: {
      copy: {
        // 允许复制
        enable: true,
        // 是否携带行列头数据
        withHeader: true,
        // 是否使用格式化数据
        withFormat: true,
      },
      brushSelection: {
        // rowCell: {
        //   // 展开两层
        //   expandDepth:4,
        // },
        colCell: true,
        dataCell: true,
      },
      // 多选
      multiSelection: true,
      // 高亮选中单元格
      selectedCellsSpotlight: true,
      // 悬停高亮.
      hoverHighlight: true,
    },

    //totals 字段用于控制表格中行（row）和列（col）的小计（subTotals）和总计（grandTotals）的显示

    totals: {
      row: {
        //是否显示行的总计
        showGrandTotals: true,
        // /是否显示行的小计
        showSubTotals: true,
        //是否反转行的总计布局（例如，将其显示在顶部而不是底部）
        reverseGrandTotalsLayout: false,
        //是否反转行的小计布局
        reverseSubTotalsLayout: false,
        //指定哪些维度（在这里是 'province'）用于计算行的小计
        subTotalsDimensions: ['department'],
        //定义如何计算行的总计
        calcGrandTotals: {
          aggregation: Aggregation.SUM,
        },
        //定义如何计算行的小计
        calcSubTotals: {
          aggregation: Aggregation.SUM,
        },
      },
      //与 row 类似，但控制列的小计和总计的显示
      col: {
        //是否显示列的总计
        showGrandTotals: true,
        //是否显示列的小计
        showSubTotals: true,
        //是否反转列的总计布局
        reverseGrandTotalsLayout: false,
        // /是否反转列的小计布局
        reverseSubTotalsLayout: true,
        //指定哪些维度（在这里是 'type'）用于计算列的小计
        subTotalsDimensions: ['type'],
        //calcGrandTotals: 和 calcSubTotals 同样定义了如何计算和显示总计和小计
        calcGrandTotals: {
          aggregation: Aggregation.SUM,
        },
        calcSubTotals: {
          aggregation: Aggregation.SUM,
        },
      },
    },
  },
}

},
mounted() {
this.bootstrap()
},
methods: {
//实例化
async bootstrap() {
const container = this.$refs.container
this.pivotSheet = new PivotSheet(container, this.s2DataConfig, this.s2Options)
this.pivotSheet.on(S2Event.DATA_CELL_CLICK, (event) => {
this.pivotSheet.tooltip.show({
position: { x: event.clientX, y: event.clientY },
content: this.dataCellTooltip(),
})
})
this.pivotSheet.on(S2Event.MERGED_CELLS_CLICK, (event) => {
const cell = this.pivotSheet.getCell(event.target)
this.pivotSheet.tooltip.show({
position: { x: event.clientX, y: event.clientY },
content: this.unmergeCell(cell),
})
})
await this.pivotSheet.render() // 异步渲染
},
dataCellTooltip() {
this.mergeButton = true
},
mergeCells() {
if (this.pivotSheet) {
this.pivotSheet.interaction.mergeCells()
}
},
unmergeCell(cell) {
this.mergeButton = false
if (this.pivotSheet) {
this.pivotSheet.interaction.unmergeCell(cell)
}
},
checkSerch() {
// 直接将选中的值赋值给 s2DataConfig.fields.rows 和 s2DataConfig.fields.columns
if (this.s2DataConfig.fields.rows != null) {
this.s2DataConfig.fields.rows = this.selectedRows
}
if (this.s2DataConfig.fields.columns != null) {
this.s2DataConfig.fields.columns = this.selectedColumns
}
this.pivotSheet.setDataCfg({
fields: {
rows: this.selectedRows,
columns: this.selectedColumns,
},
})
this.pivotSheet.render()
},

//做数据导出所需要的方法们
// 全量复制
async copyData(isFormat) {
  // 这里可以定义你的 customTransformer，如果需要的话
  const data = await asyncGetAllPlainData({
    sheetInstance: this.pivotSheet,
    split: this.split,
    formatOptions: isFormat,
  })

  copyToClipboard(data)
    .then(() => {
      console.log('data', data)
      this.$message.success('复制成功!')
    })
    .catch((error) => {
      console.log('copy failed: ', error)
      this.$message.error('复制失败!')
    })
},
async downloadData(isFormat) {
  // 使用 this 来访问组件的 data 和其他方法
  this.$message.loading('导出中...')
  try {
    const data = await asyncGetAllPlainData({
      sheetInstance: this.pivotSheet, // 使用组件的 data
      split: this.split, // 如果 split 是组件的 data 或 prop
      formatOptions: isFormat,
    })
    download(data, this.fileName)
    console.log('downloadData', data)
    this.$message.success('导出成功!')
  } catch (err) {
    this.$message.error('导出失败!')
  } finally {
    this.$message.destroy() // 销毁加载提示
  }
},

},
}
</script>

<style> </style>` @lijinke666

[annisFromchina]

[lijinke666]

你数据有问题, 每条明细数据都需要有 actualExe: 实际执行, 你的数据只有最后一条满足, 所以没有展示