2016-07-07 4 views
29

このコードでエラーが発生します。ただし、react-nativeに変更するとエラーが取り除かれます。反応ネイティブでdivを使用できますか?そうでない場合、なぜこのエラーはあまりにも明白ではないのですか?コンポーネントクラスが必要です。[オブジェクトオブジェクト]

var React = require('react'); 
var ReactNative = require('react-native'); 
var { 
    StyleSheet, 
    Text, 
    View, 
} = ReactNative; 

let Auto = React.createClass({ 
    getInitialState: function() { 
    return { value: 'Ma' } 
    }, 
    render: function() { 
    return (
     <div className="fuck-react"> 
     Blah blah blah 
     </div> 
    ) 
    } 

});

+2

リアクトネイティブでは、ビューはDivの代わりに使用されるので、View! – Dlucidone

答えて

28

いいえあなたはreact-nativeでdivタグを使用できません。以来、反応ネイティブは、抽象的なDomパーサーによってネイティブコンポーネントに自動的にディスパッチされるJSX構文に基づいています。 https://facebook.github.io/react-native/docs/tutorial.html

また、反応ネイティブは0.29の新しいバージョンにアップグレードされます。古いECMAスクリプトを無視し、JavaScriptシンタックス用の新しいECMAスクリプトを使用する必要があります。以来、反応ネイティブはjavascriptのためにreactjsを使用するので、ここから学ぶほうがよい:http://reactjs.net/guides/es6.html

+1

反応ネイティブで使用できる新しいバージョンがあります:0.29。ここをクリックしてください:[最新バージョンへアップグレード](https://facebook.github.io/react-native/docs/upgrading.html) – Riten

+0

ありがとうございます。 packerは拡張子jsxのファイルを自動的に検索しますか?バージョンはこの質問と何が関係していますか? 0.29はより良いエラーを提供しますか? – Drew

+0

React-nativeアプリケーションは主に構文に基づいているため、反応ネイティブバージョンのアップグレードでは構文の変更が優先されます。したがって、アプリケーション開発中にJSX構文の変更を適応させる必要があります。 –

6

DIVの代わりにViewを使う。

<View style={{flex: 1}}> 
     <Text>Blah blah blah</Text> 
</View> 
1

反応ネイティブでは使用できません。代わりにネイティブコンポーネントを使用してください。

<View> 
    <Text>text text text</Text> 
</View> 

は、と前にインポートすることを忘れないでください:

import { 
    Text, 
    View 
} from 'react-native'; 
0

あなたが反応ネイティブアプリケーションでReactJSコンポーネントを使用することができます。 React Nativeプロジェクトに<div>というタグを含むコンポーネントが誤ってインストールされました。

関連する問題