RefreshControl on ListView throwing Invariant Violation

Question

I'm trying to get a simple pull-to-refresh list to work. I have tried to replicate the animated gif that @sankhadeeproy007 showed in #269 but it's throwing the following error.

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of devicePage. This error is located at: in ScrollView (created by KeyboardAwareScrollView) in KeyboardAwareScrollView (at Content.js:10) in Content (created by Styled(Content)) in Styled(Content) (created by devicePage) in devicePage (created by SceneView) in SceneView (created by DrawerScreen) in DrawerScreen (created by withCachedChildNavigation(DrawerScreen)) in withCachedChildNavigation(DrawerScreen)

My code for my simple component is as follow:

    'use strict'
import React, { Component } from 'react';
import { Content, View, List, ListItem, RefreshControl, Text } from 'native-base'


class devicePage extends Component {

  constructor () {
    super()
    this.state = {
      refreshing: false,
    }
  }

  render() {
    const items = ['Bike 1', 'Bike 2', 'Bike 3']
    return (
      <Content refreshControl={this._refreshControl()}>
      <View>
        <List
          dataArray={items}
          renderRow={(item) => 
            <ListItem>
              <Text>{item}</Text>
              </ListItem>
          } />
      </View>
      </Content>
    )
  }

  _refreshControl(){
    return (
      <RefreshControl
        refreshing={this.state.refreshing}
        onRefresh={()=>this._refreshListView()} />
    )
  }

  _refreshListView(){
    //Start Rendering Spinner
    this.setState({refreshing:true})
    console.log.tron('refreshing...')
    this.setState({refreshing:false}) //Stop Rendering Spinner
  }
}

export default devicePage;

The problem is with the refreshControl. If I remove it from the Content the page renders correctly. If I move the refreshControl to the List I get the same Error as before.

If I move the refreshControl to inside the View tabs like:

      <View refreshControl={this._refreshControl()}>>
        <List
          dataArray={items}
          renderRow={(item) => 
            <ListItem>
              <Text>{item}</Text>
              </ListItem>
          } />
      </View>

I get a warning:

Warning: React.createElement: type is invalid -- expected a string ...

The related packages and versions I'm using are:

"native-base": "2.3.2",
"react-native": "0.49.1",
"react": "16.0.0-alpha.12"

Any suggestions?

SOLUTION The solution was to import RefreshControl from react-native not native-base