LoginSignup
1

More than 5 years have passed since last update.

React Native メモ (ListView)

Posted at

React Nativeでのメモ(ListView)

ListView でハマった点

  • ListView の renderRow で表示させるところでメソッドを動かしたい
class MyComponent extends Component {
  constructor() {
    super();
    const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
    this.state = {
      dataSource: ds.cloneWithRows(['row 1', 'row 2']),
    };
  }

  showTodo(todo){
   ...
  }

  renderList(todo){
    <TouchableHighlight onPress={() => {
      this.showTodo(todo)
    }}>
      <Text>{todo.name}</Text>
    </TouchableHighlight>
  }

  render() {
    return (
      <ListView
        dataSource={this.state.dataSource}
        renderRow={this.renderList}
      />
    );
  }
}

上のコードだと
_this2.showTodo is not a function と表示される.

            <ListView
        dataSource={this.state.dataSource}
        renderRow={this.renderList.bind(this)}
      />

renderRow = {this.renderList.bind(this)}と変更することで
エラーが消える

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1