私はJavaScriptをあまり得意としていません、しかしながら訳あってJSのライブラリであるReact.js その中でもReactNativeを勉強中です。そのため、以下の質問はすごく初歩的なものかもしれませんが、ご回答いただけたら幸いです。
現在下記サイトを参考にReactNativeを勉強しています。
ReactNative勉強
サイト内の説明通りに以下のソースコードを書いて動作の確認をしたのですが、挙動がわかりません。(2つ目のソースコードは呼び出し元のApp.jsです)
教えていただきたいのは、「追加」buttonが押された後の具体的な動作フローです。
①「追加」buttonが押された
②_onPress()メソッド着火
**③this.props.onPress(this.ref._lastNativeText);
④this.ref.setNativeProps({ text: '' });
**
<③について>
onPressに引数を渡しているんですか? この1行には何の意味があるのですか?
_lastNativeTextとはどこで宣言されたのですか?
<④について>
値を設定しているっぽいのですが、どこに渡されているのですか???
javascript
1export default class TodoInput extends Component { 2 constructor(props) { 3 super(props); 4 5 this.ref = {}; 6 } 7 8 _onPress = () => { 9 this.props.onPress(this.ref._lastNativeText); 10 this.ref.setNativeProps({ text: '' }); 11 } 12 13 render() { 14 const { 15 onPress, 16 } = this.props; 17 18 return ( 19 <View style={styles.container}> 20 <TextInput 21 style={styles.textInput} 22 ref={(ref) => { this.ref = ref; }} 23 /> 24 <TouchableOpacity 25 style={styles.button} 26 onPress={this._onPress} 27 > 28 <Text style={styles.buttonText}>追加</Text> 29 </TouchableOpacity> 30 </View> 31 ); 32 } 33}
javascript
1export default class App extends Component<{}> { 2 _onPress = (text) => { 3 console.log(text); 4 } 5 6 render() { 7 return ( 8 <View style={styles.container}> 9 <View style={styles.main}> 10 <TodoInput onPress={this._onPress} /> 11 </View> 12 </View> 13 ); 14 } 15}
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/07/07 09:38