0

iOS の React Native チュートリアルに従っています: https://www.raywenderlich.com/126063/react-native-tutorial

React-Native には Android のチュートリアルが不足しているため、上記の iOS リンクを Android に送信しようとしていますが、エラーは次のように表示されます。

ここに画像の説明を入力

私はインラインに変更NavigatorIOSしました：Navigator

'use strict';
//var React = require('react-native');

import React, {
  AppRegistry,
  Component,
  Navigator,
  Image,
  ListView,
  StyleSheet,
  Text,
  View
} from 'react-native';
var styles = React.StyleSheet.create({
  text: {
    color: 'black',
    backgroundColor: 'white',
    fontSize: 30,
    margin: 80
  },
  container: {
    flex: 1
  }
});


class HelloWorld extends React.Component {
  render() {
    return <React.Text style={styles.text}>Hello World (Again)</React.Text>;    
  }
}


class PropertyFinderApp extends React.Component {
  render() {
    return (
      <Navigator
        style={styles.container}
        initialRoute={{
          title: 'Property Finder',
          component: HelloWorld,
        }}
      />
    );
  }
}

React.AppRegistry.registerComponent('PropertyFinder', function() { return PropertyFinderApp });

私は React-Native に比較的慣れていませんが、これをどのように軽減できますか?

4

1 に答える 1

0

NavigatorIOS は (名前が示すように) iOS 専用のコンポーネントであり、Navigator コンポーネントとは異なる API を使用します。ちなみに、Navigator コンポーネントは、React Native チームによって公式にサポートされているコンポーネントなので、いずれにせよ、それを使用する必要があります。

詳細については、 https://facebook.github.io/react-native/docs/navigatorios.htmlと https://facebook.github.io/react-native/docs/navigator.htmlを比較してください。

実際の例に戻るには、renderScene prop を Navigator コンポーネントに追加する必要があります。また、initialRoute を変更して、renderScene メソッドで識別されるキーを持たせました (私の意見では、コンポーネントを渡すよりもクリーンに動作します)。

<Navigator
    style={styles.container}
    initialRoute={{
      title: 'Property Finder',
      component: 'HelloWorld',
    }}
    renderScene ={this._renderScene.bind(this)}
  />

次に、_renderScene メソッドを追加します。

_renderScene(route, navigator) {
    if (route.component == 'HelloWorld') {
      return <HelloWorld />
    }
    // return a default homescreen or something when the route is not matched
   return <Home />
}
于 2016-04-11T09:08:57.837 に答える