0

ReactナビゲーションのnavigationOptionsにボタン(つまり検索アイコン)付きの検索バーを追加しています。navigate入力したテキストを関数で送信したいと思います。TextInput の参照を渡してネイティブ テキストを取得する方法がわかりません。以下は、これまでに行ったコードです。

static navigationOptions = ({ navigation }) => (
    headerStyle: {
        ...
    },
    headerTitle: (
        <View style={{ width: '100%', height: 75, flexDirection: 'row', alignItems: 'center', justifyContent: 'center', borderRadius: 50, backgroundColor: 'white' }}>
            <TextInput style={{ width: '85%', padding: 15 }}
            onSubmitEditing={
                (e) => (e.nativeEvent.text.length > 2) && navigation.navigate('Brands', {text: e.nativeEvent.text})
            } />

            <TouchableOpacity style={{ width: '15%', padding: 15 }}
            onPress={() => navigation.navigate('Brands'/*, {text: HERE I WANT TO GET TEXT FROM REFERENCE}*/)}>
                <Icon type='FontAwesome' name='search'
                style={{ color: 'red', 20, textAlign: 'center' }} />
            </TouchableOpacity>
        </View>
    )
)};

しかし、navigationOptions静的であるため、thisその中にキーワードを使用することはできません。またstate、navigationOptions 内でも使用できません。refでは、ボタンを押したときに入力テキストを取得するにはどうすればよいでしょうか。


編集

TextInput~から価値を得たいref

<TextInput ref={(ref) => { this.input = ref; }} />
// OR
<TextInput ref='input' />

その値を取得できるように

this.input._lastNativeText
// OR
this.refs['input']._lastNativeText

しかし、静的であるため、thisキーワードまたはstateinを使用できません。navigationOptionsボタンのクリック時に TextInput の値にアクセスするにはどうすればよいですか?

4

2 に答える 2