はReact.Children.onlyそれは私に次のエラーを与える単一リアクト要素の子

Question

import React, { Component } from 'react'; 
import { 
    AppRegistry, 
    StyleSheet, 
    Text, 
    View 
} from 'react-native'; 
import Login from './js/components/Login'; 
import userReducers from './js/reducers/user'; 

import { createStore, combineReducers } from 'redux'; 
import { Provider } from 'react-redux'; 

let store = createStore(combineReducers({userReducers})); 

class App extends Component { 
    render() { 
    return (
     <Login /> 
    ); 
    } 
} 

export default class Testextends Component { 
    render() { 
    return (
     <Provider store = {store}> 
     <App /> 
     </Provider> 
     // <View> 
     // <Text>jhdgf</Text> 
     // </View> 
    ); 
    } 
} 

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

を受けることが予想：

私が反応し、ネイティブの再来との1つの基本的な例をしようとしています。 TouchableHighlightも削除しても、エラーは引き続き発生します。何がここに間違っているアイデアですか？

Answer 1

あなたは間違ったことをしているようではありません。貼り付けられたコードでは、エラーがコードのこの部分から来たのでしょうか？

たぶん()あなたTouchableHighlightコンポーネント間の配置しようが、私はそれが何かを変更するつもりはないと思う...

か三ではなく、バイナリの動作を試してみてください。

また、TouchableHighlightとTextをreact-nativeからインポートしてください。最初のホワイトスペースと第二のすべての湾曲括弧内：

Answer 2

てみますが、2人の子供を持っているので、次の例

<View> {...}</View> 

ですべてではありません必要な空白

<View>{ !this.props.user.loggedIn && 
      <TouchableHighlight onPress={this.onLoginButtonPress}> 
      <Text>Login</Text> 
      </TouchableHighlight> 
}</View> 

を削除します。

Answer 3

は、次のネイティブコードを反応させるのと同じ問題を持っていた：

import {Link} from 'react-router-native' 

<Link to={props.url}>{props.title}</Link> 

は、同様のコードをWEBではなく、ネイティブビューで働く理由を理解しようとする数時間をお過ごしください。実行可能なエラーメッセージや、コンポーネントがこの障害を引き起こすReact Nativeランタイムからのヒントはありません。そのため、問題を識別することは非常に困難です。 titleテキストが複数の要素として扱われるので、我々はこのようなエラーになってしまったよう

import {Link} from 'react-router-native' 
import {Text} from "react-native"; 

<Link to={props.url}><Text>{props.title}</Text></Link> 

はルックス：

は、次の手順を実行してこのクラッシュを修正するために管理します。

これは、この問題の解決策ではありません。しかし、React Nativeではこのエラーで失敗する方法がたくさんあるので、グーグルでここで終わった人にこのようなクラッシュの別の例を付けると便利かもしれません。

Answer 4

まずは、「輸出のデフォルトのクラスTestextendsコンポーネントは、」実際に

そのエラーがProviderコンポーネントが一つだけの要素がかかるためであるスローされる理由は、「輸出のデフォルトクラステストコンポーネントを拡張」でなければなりません。例のため ： 間違っ：

<provider store = {store}> 
<div/> 
<div/> 
<provider> 

正しい：あなたがコンポーネントをコメント場合は、正しくなかった

<provider store = {store}> 
<App/> 
<provider> 

。クラスエラーを試して、それが動作するかどうかを確認してください。