Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/37.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript React内联样式动态图像url不工作_Javascript_Css_Reactjs - Fatal编程技术网
Fatal编程技术网
  • javascript/
  • Javascript React内联样式动态图像url不工作

Javascript React内联样式动态图像url不工作

javascript css reactjs

Javascript React内联样式动态图像url不工作,javascript,css,reactjs,Javascript,Css,Reactjs,当我从“../assets/images/Facebook icon.png”导入import Facebook和style={{background:`url（${Facebook}）时，可以正常工作和渲染。但是，当我尝试动态替换变量的Facebook部分，以便我可以将其重新用于instagram、twitter和其他链接时，这是我的代码 <SocialMediaIcon style={{background: `url('../assets/images/${matchIcon(lin

当我从“../assets/images/Facebook icon.png”导入
import Facebook和
style={{background:`url（${Facebook}）时，
可以正常工作和渲染。但是，当我尝试动态替换变量的Facebook部分，以便我可以将其重新用于instagram、twitter和其他链接时，这是我的代码


<SocialMediaIcon style={{background: `url('../assets/images/${matchIcon(link)}-icon.png')`/>



您应该
要求导入图像以生成有效路径：


<SocialMediaIcon
  style={{
    background: `url(${require(`../assets/images/${matchIcon(
      link
    )}-icon.png`)})`,
  }}
/>;



；

向我们展示
匹配图标（link）
@bhojendraauniyar糟糕透了。它只是返回facebook、instagram等不同类型链接的关键字变量。这是代码：
const matchion=link=>link.split（'www.'）[1]。split（'.com'）[0]