Question

我的目标

我正在尝试使用react native创建一个应用程序，并希望拥有一个可以根据具体情况改变的图像。我想要一个路径列表，然后通过选择列表中的项目来选择图像。

我尝试了什么

我尝试制作一个如下图像：

----------------------------------------
Exception happened during processing of request from ('127.0.0.1', 54225)
Traceback (most recent call last):
  File "C:\Python27\lib\SocketServer.py", line 290, in _handle_request_noblock
    self.process_request(request, client_address)
  File "C:\Python27\lib\SocketServer.py", line 318, in process_request
    self.finish_request(request, client_address)
  File "C:\Python27\lib\SocketServer.py", line 331, in finish_request
    self.RequestHandlerClass(request, client_address, self)
  File "C:\Python27\lib\SocketServer.py", line 654, in __init__
    self.finish()
  File "C:\Python27\lib\SocketServer.py", line 713, in finish
    self.wfile.close()
  File "C:\Python27\lib\socket.py", line 283, in close
    self.flush()
  File "C:\Python27\lib\socket.py", line 307, in flush
    self._sock.sendall(view[write_offset:write_offset+buffer_size])
error: [Errno 10054] An existing connection was forcibly closed by the remote host

但每当我尝试这样做时，我都会收到错误消息，

<Image source={require(icons[iconNum])} />

我也尝试使用单个变量，这不是列表，这给了我同样的错误。我如何使用变量来选择我想要使用的正确图像？

Answer 1

require是具有预加载性质的javascript关键字，您必须准备要使用的每个资源，只需为其创建资源文件即可。例如：

export var icons = [
  require('./icon/icon1.png'),
  require('./icon/icon2.png'),
  require('./icon/icon3.png'),
  ...
];

图像预先捆绑到App中，在运行时提供相关路径并不意味着什么。

您可以通过将require("./icons/icon.png")更改为require("./icons/"+"icon.png")来轻松证明这一点。虽然它们在逻辑上是相同的，但后者永远不会起作用。

使用变量作为反应原生图像的路径

我的目标

我尝试了什么

1 个答案: