React native 在卡中显示webview（反应本机）

我正在使用expo作为模拟器，因为我用CRNA创建了我的react原生应用程序。我想在WebView上的一张卡片里展示一段youtube视频，但它不能像我想象的那样

这是我的密码：

import React, { Component } from 'react';
import { WebView } from 'react-native';
import { Card, CardItem } from 'native-base';

export default class MyWeb extends Component {
  render() {
    return (
      <Card>
      <CardItem>
        <WebView
          source={{uri: 'https://www.youtube.com/embed/OCMs-YhSp2o'}}
          style={{marginTop: 20}}
      /></CardItem>
      </Card>
    );
  }
}

import React，{Component}来自'React'；
从“react native”导入{WebView}；
从'native base'导入{Card，CardItem}；
导出默认类MyWeb扩展组件{
render（）{
返回(
);
}
}

我不知道这是否是因为卡，因为当我删除卡，只显示WebView，它的工作。但是因为我想把视频和其他项目（文本、图片等）放在一起，所以我需要用卡片来显示它

请帮帮我

---

提前谢谢。

我定义了卡迪姆的高度，代码现在运行得很好。感谢尼玛的评论

import React, { Component } from 'react';
import { WebView } from 'react-native';
import { Card, CardItem } from 'native-base';

export default class MyWeb extends Component {
  render() {
    return (
      <Card>
      <CardItem style={{height:200}}>
        <WebView
          source={{uri: 'https://www.youtube.com/embed/OCMs-YhSp2o'}}
          style={{marginTop: 20}}
      /></CardItem>
      </Card>
    );
  }
}

import React，{Component}来自'React'；
从“react native”导入{WebView}；
从'native base'导入{Card，CardItem}；
导出默认类MyWeb扩展组件{
render（）{
返回(
);
}
}

已从React Native中删除WebView。现在可以从“react-native webview”而不是“react-native”安装和导入它

import React, { Component } from 'react';
import { WebView } from 'react-native-webview';
import { Card, CardItem } from 'native-base';

export default class App extends Component {
  render() {
    return (
      <Card>
      <CardItem style={{height:200}}>
        <WebView
          source={{uri: 'https://www.youtube.com/embed/OCMs-YhSp2o'}}
          style={{marginTop: 20}}
      /></CardItem>
      </Card>
    );
  }
}

import React，{Component}来自'React'；
从“react native WebView”导入{WebView}；
从'native base'导入{Card，CardItem}；
导出默认类应用程序扩展组件{
render（）{
返回(
);
}
}

如果你正在使用Expo，你将面临这个问题

项目的某些依赖项与当前安装的expo软件包版本不兼容：

• react native webview-预期版本范围：10.7.0-实际安装版本：^11.0.2在安装正确版本的软件包之前，您的项目可能无法正常工作。要安装这些软件包的正确版本，请运行：expo install[软件包名称…]

---

您需要在CardItem样式中定义高度非常感谢！！！！现在可以了！T________