如何在React Native中使用onChangeText回調函數將值傳遞給另一頁？

Question

我在使用react native導航器組件時遇到一個問題，問題是我有一個index.ios.js，它只是呈現導航器場景，在此index.ios.js中有一個默認組件被顯示為默認頁面。還具有用於下一步操作的Navigator.NavigationBar組件。 默認組件具有TextInput組件，供用戶鍵入sth。

所以我的問題是，當用戶單擊主頁上的下一步按鈕時，我想檢查TextInput組件（默認頁面中）是否為null或為空，我真的沒有找到一種可以在運行時傳遞值的方法-時間是通過onTextChange回調函數實現的，是否可以重寫Navigator組件在這種情況下工作？ 但我仍然不知道該怎么做。

這些東西真的讓我非常緊張。

這是演示的用戶界面。

謝謝。

Answer 1

您可以在主頁中定義狀態，並定義一個函數以給定值設置狀態。 您可以將此功能傳遞給具有文本字段的頁面。 然后，您可以在文本字段的onChangeText上調用此函數，從而在主頁上設置狀態。 然后，您可以成功檢查主組件中的狀態，以檢查其是否為空。

 // i am assuming here that you pass the setMyText from the 'Main' component below as prop to this compoenet. class MyTextInputComponent extends Component { render () { return ( <TextInput onChangeText={this.props.setMyText} /> ) } } class Main extends Compoenent { constructor () { super() this.state = { myText: '' } } // you can pass this function to your component that has the text view like 'MyTextInputCompoenent' below setMyText = (text) => { this.setState({ myText: text }) } // here you can check if the this.state.myText is empty or not before continuing onClickNext = () => { if(this.state.myText) { // do sth } else { // do sth else } } }