Question

在我的代码中，我有两个对象。一个StatusBar＆amp;一个Text对象。我将这些作为props.children传递给另一个组件。我收到这个错误：

“返回：元素类型无效：期望字符串或类/函数（对于复合组件）但得到：undefined。您可能忘记从其定义的文件中导出组件。“

我的导出线设置得很好，为什么这不起作用？如果我删除TEXT对象，我的状态栏对象会加载。它只是Text对象，对我来说是一个问题。

这是我的app.js代码

import React, { Component, Text } from 'react';
import { Navigation } from 'react-native';
import ViewContainer from './components/viewcontainer'
import PeopleList from './components/peoplelist';
import StatusBar from './components/bar';

export default class App extends Component {

  render(){
    return(
      <ViewContainer>
        <StatusBar style={{backgroundColor:'orange'}} />
        <Text>Why wont this work?</Text>
      </ViewContainer>
    )
  }

}

我有我的组件代码viewcontainer.js

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


export default class ViewContainer extends Component {
  render() {
    return (
      <View style={[styles.ViewContainer,this.props.style]}>
        {this.props.children}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  ViewContainer: {
    flex: 1,
    flexDirection: 'column',
    justifyContent: 'flex-start',
    alignItems: 'stretch'
  },

});

Answer 1

您必须从Text导入react-native，而不是react。

替换

import React, { Component, Text } from 'react';
import { Navigation } from 'react-native';

与

import React, { Component } from 'react';
import { Navigation, Text } from 'react-native';

无法将<text>传递给props.children

1 个答案: