给出的React.cloneElement（）无法意外地读取未定义错误的道具

Question

我通过React组件道具传递了一些JSX。然后我尝试使用React.cloneElement（）来克隆该JSX以添加侦听器。但是这样做会给我错误

  

未捕获的TypeError：无法读取未定义的属性'props'

这是将JSX传递给子React元素的组件：

<FormModal
    size='small'
    formName='sortForm'
    header='Sort'
    headerIcon='sort'
    handleSubmit={ this.sortSubmit }
    content={
        <SortForm table={ this.props.table } initialValues={ { orderBy: this.props.search.orderBy, orderDirection: this.props.search.orderDirection } } />
    }
    trigger={
        <Button icon floated='right' size="mini">
            <Icon name='sort' />
        </Button>
    }
/>

以下FormModal代码克隆了传入的content和trigger道具：

class FormModal extends Component {

    constructor( props ) {
        super( props );
        this.handleOkay = this.handleOkay.bind( this );
        this.handleSubmit = this.handleSubmit.bind( this );
        this.handleOpen = this.handleOpen.bind( this );
        this.handleClose = this.handleClose.bind( this );
        this.modalOpen = false;
        // here:
        this.content = React.cloneElement(
            this.props.content, 
            { onSubmit: this.handleSubmit }
        );
        this.trigger = React.cloneElement(
            this.props.trigger, 
            { onClick: this.handleOpen }
        );
    }

如果我用this.props.content之类的简单JSX替换this.props.trigger参数中的cloneElement()和<div></div>，它可以正常工作，所以我知道问题出在那些道具上传入。我无法弄明白为什么。控制台事先记录这些道具，表明它们没有被定义。