React native 不变冲突：未找到名称视图的视图配置：React Native

我是个初学者，不会做出土生土长的反应。我有定制的可重用组件。我正在尝试构建登录表单，如下所示：

我在LoginForm.js中使用了代码

import Button from './common/Button';
import Card  from './common/Card';
import CardItem from './common/CardItem';
class LoginForm extends Component {
constructor(){
  super();
  this.state = {
    title: 'Title from state'
  };
}

  render() {
    return(
        <Card>
          <CardItem>
           <Button>Login</Button>
          </CardItem>
        </Card>
    );
  }
}

如果我将代码LoginForm.js替换为

，例如

Login

，它就会工作

---

请帮忙，我错过了什么？

更新您的

Card.js

和

CardItem.js

，如下所示。它应该是

视图

，而不是

视图

Card.js

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

const Card = (props) => {
  return(
    <view>
      { props.children }
    </view>
      );
    }

export default Card;

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

const Card = (props) => {
  return(
    <View>
      { props.children }
    </View>
      );
    }

export default Card;

从“React”导入React；
从“react native”导入{View，StyleSheet}；
康斯特卡=（道具）=>{
返回(
{props.children}
);
}
导出默认卡；

CardItem.js

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

const CardItem = (props) => {
  return(
    <view style={styles.cardItem}>
      { props.children }
    </view>
  );
}
export default CardItem;

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

const CardItem = (props) => {
  return(
    <View style={styles.cardItem}>
      { props.children }
    </View>
  );
}
export default CardItem;

从“React”导入React；
从“react native”导入{View，StyleSheet}；
康斯特·卡迪姆=（道具）=>{
返回(
{props.children}
);
}
导出默认项；

你能分享你的组件（卡片、卡片和按钮）的详细信息吗？我更新了问题，谢谢。我不相信！非常感谢。

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

const Card = (props) => {
  return(
    <View>
      { props.children }
    </View>
      );
    }

export default Card;

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

const CardItem = (props) => {
  return(
    <View style={styles.cardItem}>
      { props.children }
    </View>
  );
}
export default CardItem;