React Native: Wie fügt man zwei Aktionen zu einer Schaltfläche hinzu?

Question

Ich habe ein kleines Problem. Ich möchte zwei Aktionen an einen Button weitergeben, aber ich kann es nicht herausfinden. Ich benutze die react-native-Router-Flux-Bibliothek. Ich habe so etwas versucht, aber es funktioniert nicht wirklich.

Wenn jemand helfen könnte, wäre das genial. Vielen Dank !

<Button 
 
    onPress={Actions.Main1 && Actions.Tab2} 
 
    style={{ width: 90, height: 90 }} > 
 
     <Text>Show</Text> 
 
</Button>

Answer 1

Die onPress prop nimmt eine Funktion, und nur eine Funktion. Es gibt keine Syntax für die automatische Kombination von zwei Funktionen in Javascript. Sie müssen eine neue Funktion erstellen, die beide Aktionen ausführt.

<Button 
    onPress={(e) => { 
     Actions.Main1(e); 
     Actions.Tab2(e); 
    }} 
    style={{ width: 90, height: 90 }} > 
     <Text>Show</Text> 
</Button> 

Einige Anmerkungen:

1. habe ich die Ereignisparameter in beide der Aktionen, da nur eine der Funktionen vorbei (das heißt onPress={Actions.Main1}) selbst würde auch diese Parameter übergeben. Dies ist in Ihrem Fall möglicherweise nicht notwendig.
2. Das kleine Problem mit diesem Code ist, dass eine neue Funktion jedes Mal erstellt wird, wenn die render-Funktion dieser Komponente aufgerufen wird. Es ist nicht schrecklich, aber auch nicht ideal. Bedenken Sie das in Zukunft. Ich schließe diese Optimierung in diesem Beitrag ein, weil a) wir den Rest der Implementierung der Komponente nicht sehen, b) Ich denke, dass diese Frage rudimentär genug war, um uns nur um das Hauptkonzept zu kümmern.