react-native の ActivityIndicatorIOS が表示できませんでした。

Question

react-nativeを使ってアプリを作っています。

react-native-cli: 2.0.1
react-native: 0.42.3

ローディングの画像を表示しようとしてActivityIndicatorIOSを使ってみたところエラーがでました。

element type is invalid:expected a string (for built-in components) or a class/function(for composite components) but got:undefined. Check the render method of 'Test'

コードはこちらです

import React, {
  Component,
} from 'react';
import {StyleSheet,
  Text,
  View,
  ActivityIndicatorIOS,
} from "react-native";

export default Test = React.createClass({
  render() {
    return(
      <ActivityIndicatorIOS />
    );
  }
});

ちなみに<ActivityIndicatorIOS />を<Text />等にすると正常に表示されます。

これを修正するにはどのようにすれば良いか教えて頂けませんでしょうか。
よろしくお願い致します。

Answer 1

ActivityIndicatorIOS は 0.28.0 で deprecated になりました。
代わりに ActivityIndicator をお使いください。

https://facebook.github.io/react-native/docs/activityindicator.html

↓サンプルコード

import React, {
  Component,
} from 'react';
import {
  StyleSheet,
  Text,
  View,
  ActivityIndicator,
  AppRegistry,
} from 'react-native';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});

export default class Test extends Component {
  render() {
    return(
      <View style={styles.container}>
        <ActivityIndicator
          animating
          size='large'
        />
      </View>
    );
  }
}

AppRegistry.registerComponent('indicator', () => Test);

Comments

[aratan]

なんと非推奨になっていたのですね。
古い情報を見ていたようです。
無事にできました、ありがとうございます。