React数据网格并不总是显示最后几列的值

时间:2017-06-22 01:31:46

标签: react-data-grid

我的屏幕尺寸越小,列中的值就越多。一旦我手动调整屏幕宽度(通过拖动它更大或更小),所有值都会显示出来。这似乎是一个错误。我附上了两张照片,显示了html如何在相邻的单元格中显示一个值而没有显示值。

One cell showing value the next not showing value | Before I drag the window size

getGridProps: ->
    { budgets } = @props.profile
    rowHeight = headerHeight = 35
    extraHeightToPreventScrollBar = 10
    rowsCount = budgets?.length ? 0

    columns: @getColumns()
    rowGetter: (i) =>
        budgetRows = @getBudgetRows()
        budgetRows[i]
    rowsCount: rowsCount
    minHeight: rowsCount * rowHeight + headerHeight + extraHeightToPreventScrollBar
    enableCellSelect: not @state.tableDisabled
    onGridRowsUpdated: @handleGridRowsUpdated


getColumns: ->
    cols = [{ key: 'year', name: 'Year', editable: false, width: 70 }]
    for month in MONTHS
        cols.push
            key: month
            name: month
            editable: not @state.tableDisabled
            formatter: FormattedCell
    cols.push
        key: 'total'
        name: 'Total'
        editable: false
        formatter: FormattedCell
    cols.push
        key: 'trash'
        name: ''
        editable: false
        formatter: getTrashCan @removeBudget, @state.tableDisabled
        width: 50

    cols

getBudgetRows: ->
    { budgets } = @props.profile
    _.map budgets, (monthlyBudgets) ->
        row = { year: monthlyBudgets.year }
        for month, monthIdx in MONTHS
            row[month] = monthlyBudgets.budgets[monthIdx] ? '' # ReactDataGrid cannot take null, convert to ''
        row.total = Util.getBudgetsTotal monthlyBudgets ? ''
        row.trash = monthlyBudgets.year
        row

1 个答案:

答案 0 :(得分:0)

我们找到的解决方案是将minColumnWidth:10添加到gridProps