tech

ReactNativeでのInputの値の取得方法２種

基礎だけどチュートリアルには書いてなかったりする

大きく分けて2種類

1, onChangeTextでstateを変更して、valueにいれる 

1
2
 
// render
<TextInput onChange={text=>this.setState({text})} value={this.state.text} />
 

1
2
3
 
_submit(){
  console.log(this.state.text);
}

わかりやすいが、キー打つたびコンポーネントを更新する。

2, defalutValueだけ設定して、submitのときだけrefで呼び出す 

1
2
3
4
 
<TextInput ref="text" defaultValue={this.props.value} />
_submit(){
  console.log();
}
 

1
2
3
4
5
 
 a = 'piyo'
 for(i = 1;i<3;I++){
	 echo hoge;
 }
return hoge;

このとき、valueプロパティはTextInputコンポーネントが勝手に書き換える

これでひたすら再描画されることがなくなる。
Reactなので再描画と言っても差分のみだが、render前などに都度処理入れてる場合は重くなりうるので注意。