Добавить пользовательский реквизит в пользовательский компонент

Я построил свой собственный компонент 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} Разбейте и вставьте все оригинальные реквизиты один за другим без специальных реквизитов, но таким образом я теряю эффект «затухания», а также это уродливый способ справиться с этой проблемой. Есть ли более простой способ сделать это?

Ответы на вопрос(1)

Ваш ответ на вопрос