印刷＆lt; svg＆gt;内部＆lt; img＆gt;关于反应

发布于 2025-01-29 05:10:54 字数 874 浏览 1 评论 0原文

您好，我试图用SVG制作小应用程序。我有一个返回SVG和其他信息的请求。

[
  {
    "svg": "<svg \n  xmlns=\"http://www.w3.org/2000/svg\"\n  class=\"h-6 w-6\"\n  fill=\"none\"\n  viewBox=\"0 0 24 24\"\n  stroke=\"currentColor\"\n  stroke-width=\"2\"\n>\n  <path \n  stroke-linecap=\"round\"\n  stroke-linejoin=\"round\"\n  d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"\n  />\n</svg>",
  }
]

获得SVG值

  useEffect(() => {
    getSummaryWarnings().then((res) => {
      setData(res.data);
    });
  }, []);

打印IMG

 {data.map((item) => (
          <img
            tabIndex={0}
            key={item._id}
            className="warning-sign"
            alt={item.title}
            src={item.svg}
            onClick={() => tooglePopup(item)}
          />
        ))}

，但我看不到我的SVG。任何帮助。

原文

Hello I am trying to make small app with svgs.
I have a request that returns svg and other informations.

[
  {
    "svg": "<svg \n  xmlns=\"http://www.w3.org/2000/svg\"\n  class=\"h-6 w-6\"\n  fill=\"none\"\n  viewBox=\"0 0 24 24\"\n  stroke=\"currentColor\"\n  stroke-width=\"2\"\n>\n  <path \n  stroke-linecap=\"round\"\n  stroke-linejoin=\"round\"\n  d=\"M11 19l-7-7 7-7m8 14l-7-7 7-7\"\n  />\n</svg>",
  }
]

Getting svg value

  useEffect(() => {
    getSummaryWarnings().then((res) => {
      setData(res.data);
    });
  }, []);

Printing the img

 {data.map((item) => (
          <img
            tabIndex={0}
            key={item._id}
            className="warning-sign"
            alt={item.title}
            src={item.svg}
            onClick={() => tooglePopup(item)}
          />
        ))}

But i cant see my svg.
Any help.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

疯到世界奔溃 2025-02-05 05:10:54

我找到了一个替代解决方案：

我们可以用这个打印SVG

<div
            tabIndex={0}
            key={item._id}
            className="warning-sign"
            alt={item.title}
            onClick={() => tooglePopup(item)}
            dangerouslySetInnerHTML={{ __html: item.svg }}
          />

I found an alternative solution:

We can print svg with this

<div
            tabIndex={0}
            key={item._id}
            className="warning-sign"
            alt={item.title}
            onClick={() => tooglePopup(item)}
            dangerouslySetInnerHTML={{ __html: item.svg }}
          />

回复收藏 0 原文

~没有更多了~