Javascript 使用.map和匿名函数时出现问题（React Native）

创建了一个名为“imagem”的组件，该组件应显示从阵列接收到的图像的位置

我收到错误“错误：捆绑失败：错误：src\components\Imagem.js:第10行的调用无效：require（name）”

似乎map（）也不起作用

• map（）不起作用（不知道为什么），我尝试更改代码以显示包含{name}的简单文本，但它不显示（不在数组“位置”中运行）； 当我尝试使用带有{locations[0]}的文本来使用out map（）时，它确实会显示出来

• 关于require（），我不知道它为什么不起作用： 如果我创建了一个具有“../imagem/teste.png”的局部变量，并在require（示例）中使用它，它就会工作， 如果我从道具那里收到它，它不会

（app.js）

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

（Imagem.js）

import React，{Component}来自'React'；
从“react native”导入{Image，StyleSheet}；
导出默认类Imagem扩展组件{
render（）{
const{locations}=this.props；
返回(
locations.map（name=>{
})
);
}
}
const styles=StyleSheet.create({
img：{
宽度：30，
身高：30
}
})

我希望我可以使用我的组件“Imagem.js”发送一组位置，并在应用程序屏幕上显示这些图像

---

我是个不折不扣的人，请帮助地图返回带有更改项目的新阵列

locations.map(name => {
  return <Image source={name} style={styles.img} />
})

locations.map（名称=>{
返回
})

或

locations.map（name=>）

---

还请记住向图像添加关键道具；）

地图应返回带有更改项目的新数组

locations.map(name => {
  return <Image source={name} style={styles.img} />
})

locations.map（名称=>{
返回
})

或

locations.map（name=>）

---

还请记住向Image；）添加键道具

，因为

require

与

import

几乎相同。加载的模块始终需要一个静态位置。它不使用动态值。 但您可以尝试将require移到您的

应用程序上

<Imagem locations = {[require('./src/imagem/teste.png'), require('./src/imagem/teste2.png')]}/>

---

我不太确定这是否可以开箱即用，或者你必须在这里处理一些异步的东西。

因为

需要

与

导入

几乎相同，你总是需要加载模块的静态位置。它不能处理动态值。 但您可以尝试将require移到您的

应用程序上

<Imagem locations = {[require('./src/imagem/teste.png'), require('./src/imagem/teste2.png')]}/>

---

我不太确定这是否是现成的，或者您必须在这里处理一些异步内容。

在map函数中，您应该返回一些内容。它将添加到最终结果数组中。似乎您的

Imagem

组件可以简单地编写如下内容

export default Imagem = (props) => (
    props.locations.map(name => <Image source={name} style = {styles.img} />)
)

导出默认图像m=（道具）=>(
props.locations.map（name=>）
)

作为es6 arrow函数的行为，在

locations.map（name=>）

code段将创建预期的输出

---

希望这对您有所帮助。

在map函数中，您应该返回一些内容。它将添加到最终结果数组中。似乎您的

Imagem

组件可以简单地编写如下内容

export default Imagem = (props) => (
    props.locations.map(name => <Image source={name} style = {styles.img} />)
)

导出默认图像m=（道具）=>(
props.locations.map（name=>）
)

作为es6 arrow函数的行为，在

locations.map（name=>）

code段将创建预期的输出

---

希望这会对您有所帮助。

谢谢，它工作了，不幸的是stack只允许将一个标记为答案，所以我做了第一个回答。谢谢帮助谢谢，它工作了，不幸的是stack只允许将一个标记为答案，所以我做了第一个回答。谢谢帮助谢谢，它工作了，不幸的是stack只允许将一个标记为答案回答，所以我做了第一个回答。谢谢你的帮助谢谢，它工作了，不幸的是堆栈只允许将一个标记为答案，所以我做了第一个回答。谢谢你的帮助

export default Imagem = (props) => (
    props.locations.map(name => <Image source={name} style = {styles.img} />)
)