Question

这里我在images文件夹中有大约20个svg文件

([0-9]+)

如果设置图像src文件夹，我怎么只能检索1张图像

public 
  |-images
        -| 20 svg files

所以在这里，我如何从公用文件夹中检索可在组件中使用的图像数组

更新：

说我的文件夹结构就像

 import React from 'react';

import svg from "../src/images/image1.svg"
class App extends React.Component{

   render(){
     return(
       <div>
         <img src={svg} alt="info"></img>
       </div>
     )
   }
}

export default App;

然后我找不到错误模块

Answer 1

我认为您可以这样处理：

import React from 'react';

var images = [];

class App extends React.Component{
   function importAll(r) {
     return r.keys().map(r);
   }
   componentWillMount() {
     images = this.importAll(require.context('./../../images/', false, /\.(png|jpe?g|svg)$/));
   }
   render(){
     return(
       <div>
         {images.map((image, index) => <img key={index} src={image} alt="info"></img>)}
       </div>
     )
   }
}

export default App;

无法从公共文件夹到React js中的组件获取一系列svg文件

1 个答案: