Verwenden Sie Spread Requisiten mit zusätzlichen Requisiten

Question

Wie kann ich eine andere Eigenschaft anhängen? Ich habe eine Komponente reagieren, wenn jemand in vergangen ist ... Requisiten und ich möchte auf eine zusätzliche Stütze

<AccountsStatus {...props} /> 

Answer 1

Gerade in der Sequenz hinzufügen anhängen:

<AccountsStatus {...props} otherProp={true} /> 

Oder Sie können Requisiten klonen, hinzufügen die andere Stütze zu dem Klon, und dann tun:

<AccountsStatus {...newProps} /> 

Aber ich würde auf zu tun, dass es nicht empfehlen, Sie lib das Objekt zu klonen nee würde.

Answer 2

prägnanter Ansatz, dies zu tun basiert an object spread operator auf mit:

<AccountsStatus {...props, extraProp: extraValue} /> 

Um in der Lage sein, es zu benutzen, müssen Sie Babel konfiguriert transform-object-rest-spread Plugin zu verwenden.

Answer 3

Bedenken Sie, dass die Reihenfolge, in der Sie Ihre Requisiten übergeben, bestimmen wird, welcher Wert an diese Komponente übergeben wird. Dies gilt, wenn zwei Schlüssel mit demselben Namen vorhanden sind.

Zum Beispiel:

<AccountsStatus extraProp={extraValue} {...props} /> 

und

<AccountsStatus {...props} extraProp={extraValue} /> 

gleich aussehen, aber in dem ersten Beispiel, wenn Sie Ihr props Objekt verbreitet wurden, die einen extraProp Schlüssel enthalten ist, wäre es überschreiben der extraProp Wert, den Sie vor ihm übergeben.

Answer 4

einfach die Stütze über dem Operator Verbreitung senden:

<AccountsStatus 
    otherProp={otherPropValue} 
    {...props} 
/> 

Denken Sie daran, immer es über die Verbreitung Requisiten angeben. Wenn Sie die Requisite mit dem gleichen Namen in Requisiten übergeben, möchten Sie sie wahrscheinlich überschreiben. Sie können mehr über Requisiten in this article lesen, es deckt eine Vielzahl von Möglichkeiten ab, wie bestimmte Arten von Requisiten übergeben werden.

Answer 5

Ich kann das jetzt nicht testen, aber sollte das nicht funktionieren?

<AccountsStatus foo={[...props, extraProp]} />