Füge benutzerdefinierte Requisiten zu einer benutzerdefinierten Komponente hinzu

Ich habe meine eigene angepasste Popover-Komponente für das React-Bootstrap erstellt:

export default class MyPopover extends Component {
  // ...
  render() {
    return (
        <Popover {...this.props} >
           // ....
        </Popover>
    );
  }
}

Die Komponente wird folgendermaßen gerendert:

// ... 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>
    );
  }

Nun, ich möchte @ benutzerdefinierte Requisiten hinzufügMyPopover -Komponente wie diese: mein Text Und um die neuen Requisiten zu verwenden, um einige Dinge im Popover einzustellen, zum Beispiel -

    <Popover {...this.props} className={this.getClassName()}>
       {this.showTheRightText(this.props)}
    </Popover>

aber dann bekomme ich diese Warnung im Browser:

Warnung: Unbekannte RequisitenpopoverType am Tag. Entfernen Sie diese Requisiten aus dem Element.

Now, ich denke, ich kann nur das @ entfern{...this.props} Teil und füge alle originalen Requisiten nacheinander ohne die benutzerdefinierten Requisiten ein, aber auf diese Weise verliere ich den "Fade" -Effekt und es ist auch eine hässliche Art, mit diesem Problem umzugehen. Gibt es eine einfachere Möglichkeit?

Antworten auf die Frage(2)

Ihre Antwort auf die Frage