Javascript 不变冲突：元素类型无效：应为字符串。（图像错误）

我试图在react native中创建一个组件

该组件的示例为：

从“React”导入React
从“道具类型”导入道具类型
从“react native”导入{视图、文本、图像}
常量MyComponent=（{Text，Image}）=>{
返回(
{Text}
)
}
MyComponent.propTypes={
Text:PropTypes.string，
Image:PropTypes.string，
}
导出默认MyComponent

如果删除该组件，一切正常，但当我尝试使用image组件时，它会在下图中返回错误：

（它使用图标，但不使用图像。）

组件的导入方式如下所示：

从“./MyComponent”导入MyComponent

如果我将导入更改为：

从“/MyComponent”导入{MyComponent}

我收到另一个错误（如下所示）：

---

您不需要将

文本

和

图像

作为道具传递，因为您需要导入它们。大写名称用于组件

React还希望渲染一个顶级元素，而您正在传递两个。要实现此功能，您需要将它们包装在

视图中

：

const MyComponent = ({text}) => {

  return (
    <View>
      <Text>{text}</Text>
      <Image source={{uri: require('../../assets/images/HeaderLogo.png')}} />
    </View>
  )
}

constmycomponent=（{text}）=>{
返回(
{text}
)
}

尝试导入并使用如下图像

import myIMage from '../../sourcefile.png'

const Component = (props) => {
return (
<View>
<View />
<Image source={myImage} style={{height: 100, width: 100}} /> //style is important here 
</View>

export default Component;

从“../../sourcefile.png”导入myIMage
常量组件=（道具）=>{
返回(
//风格在这里很重要
导出默认组件；

您正在将文本和图像作为参数（道具）传递给函数

不确定你在哪里使用图像道具；如果你没有，你应该删除它

至于文本参数，您需要将其更改为带有小写字母t的文本。作为道具传递的任何内容本质上都是函数的参数。使用大写字母t与JSX文本元素冲突，JSX文本元素在呈现函数中使用，并键入，以便呈现相关的UI元素

简而言之，删除您传入的文本和图像参数的所有大写引用。您的代码应该如下所示：

import React from 'react'
import PropTypes from 'prop-types'
import { View, Text, Image } from 'react-native'


const MyComponent = ({text}) => {

  return (
    <Text>{text}</Text>
    <Image source={require('../../assets/images/HeaderLogo.png')} />
  )
}

MyComponent.propTypes = {
  text: PropTypes.string, 
}

export default MyComponent

从“React”导入React
从“道具类型”导入道具类型
从“react native”导入{视图、文本、图像}
常量MyComponent=（{text}）=>{
返回(
{text}
)
}
MyComponent.propTypes={
text:PropTypes.string，
}
导出默认MyComponent