小编Pau*_*und的帖子

使用ReactJS动态加载本地映像

我正在尝试从数组中渲染多个图像,将其作为属性传递给"Image"组件.但是,无论出于何种原因,我想呈现的本地图像都没有显示出来.如果我加载托管在Web地址的图像,则会显示该图像,表示传递给Image组件的"imageSource"属性没有任何问题.我尝试过使用源格式,如下所示:

let source = 'require(./img/' + props.imageSource + ")";
Run Code Online (Sandbox Code Playgroud)

或尝试:

<img src={{uri: source}} role="presentation" style={style.image} />
Run Code Online (Sandbox Code Playgroud)

......但我所做的一切都没有任何区别.

该组件如下所示.我完全陷入困境,所以非常感谢帮助!

import React from 'react';

let Image = function statelessFunctionComponentClass(props) {

  let source = './img/' + props.imageSource;

  const style = {

    image : {

      width: '400pt',
      height: '400pt'
    }
  }

  return (

    <img src={source} role="presentation" style={style.image} />
  )
}

export default Image
Run Code Online (Sandbox Code Playgroud)

javascript image web reactjs react-jsx

2
推荐指数
2
解决办法
8597
查看次数

标签 统计

image ×1

javascript ×1

react-jsx ×1

reactjs ×1

web ×1