質問: (text) => { console.log(text); } render() { return ( ); } } ```
回答: **3this.props.onPress(this.ref._lastNativeText); 4this.ref.setNativeProps({ text: '' }); ** <3について> > > onPressに引数を渡しているんですか? この1行には何の意味があるのですか? > > _lastNativeTextとはどこで宣言されたのですか? > > > `this.ref`の名前が少しややこしいかもですね。これはこのコードではTextInputコンポーネントをさしているので`this.textInputRef`のような変数名にすると少しわかりやすいかもしれないです。 それで、refはTextInputコンポーネントをさしていて、それに`_lastNativeText`というメソッドを呼び出しています。 ReactNativeでは慣習としてインターナルなAPIには`_`のprefixをつけています。そのことからこれはTextInputで定義されていてかつドキュメントには記載されていないと推測できます。なのでこの場合コードを見にきます。これです: 無事`_lastNativeText`がありました。どうやらTextInputに入力されたtextが入っているようです。 順番が前後しましたが、`this.props.onPress`を見たいと思います。 `this.props.onPress`とあるので、コンポーネントに渡されたpropsに存在するメソッドを呼んでいるとわかります。propsはコンポーネントが利用されているところでコンポーネントに渡されているはずです。ここでは`App`コンポーネントの``がそうです。`TodoInput`コンポーネントの`onPress`propsに`App`コンポーネントの`_onPress`メソッドが渡されています。 `App`コンポーネントの`_onPress`定義を見てみると ``` _onPress = (text) => { console.log(text); } ``` とあるので、textを受け取ってconsoleに表示することをしています。 ので、buttonを押した後のフローはここまで 1. 「追加」buttonが押された 2. `ToduInput`の`_onPress()`メソッド着火 3. `props`で渡された`onPress`が呼ばれる。そのとき`onPress`の引数は`TodoInput`内の`TextInput`が保持する文字(`_lastNativeText`) 4. `props`で渡された`onPress`は`App`コンポーネントの`_onPress`の呼び出しであり、 5. それは渡された文字をコンソールに表示する となります。その後 6.TextInputの文字を空にする があります。6については下に書きます。 <4について> > > 値を設定しているっぽいのですが、どこに渡されているのですか??? > > > 上述のように、`TextInput`のメソッドを呼び出しています。これについては`clear`という公開されているメソッドがあるのでそちらを呼び出したほうがコードの安定性は増すはずです。