Добавить пользовательский реквизит в пользовательский компонент
Я построил свой собственный компонент Popover реагирующей загрузки:
export default class MyPopover extends Component {
// ...
render() {
return (
<Popover {...this.props} >
// ....
</Popover>
);
}
}
Компонент отображается так:
// ... my different class ...
render() {
const popoverExample = (
<MyPopover id="my-first-popover" title="My Title">
my text
</MyPopover >
);
return (
<OverlayTrigger trigger="click" placement="top" overlay={popoverExample}>
<Button>Click Me</Button>
</OverlayTrigger>
);
}
Теперь я хочу добавить пользовательский реквизитMyPopover
компонент, как это: мой текст и использовать новые реквизиты, чтобы установить некоторые вещи в поповере, например -
<Popover {...this.props} className={this.getClassName()}>
{this.showTheRightText(this.props)}
</Popover>
но тогда я получаю это предупреждение в браузере:
Предупреждение: неизвестный реквизитpopoverType
на теге. Удалите эти реквизиты из элемента.
Теперь, я думаю, что я могу просто удалить{...this.props}
Разбейте и вставьте все оригинальные реквизиты один за другим без специальных реквизитов, но таким образом я теряю эффект «затухания», а также это уродливый способ справиться с этой проблемой. Есть ли более простой способ сделать это?