所以我最近接手了一個專案。我之前的那個人使用 SVG。我的問題是那些讓 JSX 檔案很難閱讀。有很多像下面這樣的標簽。
<svg viewBox="0 0 488.455 488.455" fill="currentColor">
<path d="M287.396 216.317c23.845 23.845 23.845 62.505 0 86.35s-62.505 23.845-86.35 0-23.845-62.505 0-86.35 62.505-23.845 86.35 0" />
<path d="M427.397 91.581H385.21l-30.544-61.059H133.76l-30.515 61.089-42.127.075C27.533 91.746.193 119.115.164 152.715L0 396.86c0 33.675 27.384 61.074 61.059 61.074h366.338c33.675 0 61.059-27.384 61.059-61.059V152.639c-.001-33.674-27.385-61.058-61.059-61.058zM244.22 381.61c-67.335 0-122.118-54.783-122.118-122.118s54.783-122.118 122.118-122.118 122.118 54.783 122.118 122.118S311.555 381.61 244.22 381.61z" />
</svg>
最初這個專案是使用普通的 HTML、js、CSS 構建的，我想這可能就是原因。我的問題是：正確的反應檔案組織是什么？我應該將所有這些路徑保存到不同的 js 檔案中并匯入它們嗎？我應該添加import ReactSVG from 'react-svg'而不是使用標簽嗎？我對此有點困惑
uj5u.com熱心網友回復：
src例如icons，如果這些 svg 恰好是圖示，您可以在其中創建自定義檔案夾。并在其中創建包含 svg 代碼的 q react 組件。
import React from "react";
const MyIcon = () => {
return(
<svg>
{/* svg code here */}
</svg>
)
}
并在其他組件中使用此組件
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/469374.html
標籤：javascript html css 反应 svg