0

当我继承/子类化“列”组件时,它会抛出Warning: Failed prop type: Table only accepts children of type Column

这就是我分类的方式Column

import React, {Component, PropTypes} from 'react';
import * as RV from 'react-virtualized';

class Column extends Component {
    constructor() {
        super();
    }

    render() {
        return (
            <RVC.Column {...this.props} type="Column" />
        )
    }
}

Column.defaultProps = RV.Column.defaultProps;
Column.propTypes = RV.Column.propTypes;

export default Column;

它工作得很好,但我怎样才能避免这个警告呢?

4

2 回答 2

1

我认为 subclassing 没有任何好处Column。我假设您的真正意图是设置默认值或干燥您的项目,在这种情况下,我建议只对如下列使用工厂函数:

import { Column, Table } from 'react-virtualized'

export default function CustomColumn (columnProps) {
  const customProps = {
    // Set any default props here ...
  }

  return (
    <Column
      {...customProps}
      {...columnProps}          
    />
  )
}

function ExampleTable (tableProps) {
  return (
    <Table {...tableProps}>
      {CustomColumn({
        dataKey: 'foo',
        width: 100
      })}
      {CustomColumn({
        dataKey: 'bar',
        width: 100
      })}
    </Table>
  )
}

对于它的价值,我已经在生产项目中完成了这项工作,并且效果很好。如果您认为您有一个强大的子类化用例,请Column告诉我,我会考虑添加对它的支持。

于 2016-09-26T19:01:09.130 回答
0

恐怕你根本没有子类化RV.Column,你仍然是子类React.Component化,只是你的组件的名称是Column. React 仍然会显示错误,因为您自定义Column!== RVC.Column

为什么你首先要对它进行子类化?做什么type="Column"

于 2016-09-26T18:49:10.063 回答