万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

React native onChangeTextをする is.setState is not a functionのエラーが

React Native ファーストインプレッション - Qiita

この記事を参考に以下のサイトを参考 facebook.github.io

class AwesomeProject extends Component {
  constructor(props) {
    super(props);
    this.state = {text: ""};
  }
  // これ不要?
  onChangeText(text) {
    console.log(text);
    this.setState({text});
  }
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          {this.state.text}
        </Text>
        <TextInput
          style={styles.textInput}
          onChangeText={(text) => this.setState({text})}
          // onChangeText={this.onChangeText}
        />
      </View>
    );
  }
}

onChangeText={(text) => this.setState({text})}はうまくいく。 しかし、onChangeText={this.onChangeText}として自分のonChangeTextメソッド経由で上手く出来ない。 this.setState is not a functionのエラーが出る。

thisのスコープが入れ替わるとかのよくわからない現象・・・。

portaltan.hatenablog.com

を読んた。

javascript - Unable to access React instance (this) inside event handler - Stack Overflow stackoverflow.com

ちなみに、this.setState({text})でもいいのか?と思ったが、おそらくtextとプロパティが同名のときは省略できるのだと思う。 onChangeText={(text) => this.setState({text:text})}としてもうまくいった。