Блог

Главная - Вопросы по программированию - В компоненте функции без состояния реакции отсутствуют реквизиты, но нет предупреждений о типе пропуска в консоли

В компоненте функции без состояния реакции отсутствуют реквизиты, но нет предупреждений о типе пропуска в консоли

#javascript #reactjs

#javascript #reactjs

Вопрос:

У меня есть следующий функциональный компонент без состояния:

 function numberOfReadsControls(props) {
return (
    <div>
        <ControlLabel>Start Date</ControlLabel>
        <DateField
            dateFormat="YYYY-MM-DD HH:mm"
            defaultValue={props.reportParams.startDate}
            updateOnDateClick={true}
            onChange={props.startCalOnChange}/>
        <br/><br/>
        {/* more selectors here, removed for brevity*/}
    </div>
);
}

numberOfReadsControls.propTypes = {
    startCalOnChange: React.PropTypes.func.isRequired,
    //more props removed for brevity
    testMissingProp: React.PropTypes.string.isRequired
};

module.exports = {
    numberOfReadsControls

}

и я использую эту функцию следующим образом в своей функции рендеринга: 

 controls = reportControls.numberOfReadsControls(
                $.extend({
                    //props removed for brevity
                    startCalOnChange: this.startCalOnChange,
                }, this.state)
            );

затем позже в возврате моей функции рендеринга:

 ...
return (
<div>
    {controls}
</div>
)

Однако я никогда не получаю предупреждение консоли о отсутствующем реквизите «testMissingProp».

Что я делаю не так?

tldr: у меня есть функциональный компонент без состояния с требуемыми реквизитами, но когда он отсутствует, я не получаю никакого оператора регистрации, в котором говорится, что отсутствует реквизит, как и ожидалось

Комментарии:

1. Является ли рендеринг компонента таким, как задумано?

2. Разве вам не controls нужно обернуть как {controls} ? В противном случае компонент будет отображаться как <div>controls</div>

3. Компонент отображается точно так, как ожидалось. Единственное, чего мне не хватает, — это ожидаемое предупреждение, сообщающее мне о недостающем реквизите.

4. да, вы правы, он отображается как {controls} . Я отредактировал фрагмент

5. На мой взгляд, похоже, что вы выполняете что-то вроде завершения обычной обработки компонента react; вы в основном просто вызываете функцию, нет? Например, если вы импортировали его и отобразили как компонент, как <NumberOfReadControls {...extendedProps} /> я предполагаю, это сработает.