你可以像使用道具一样更新它。

null

const SvgCp = function({iconColor}) {
  return  <article className="flex card__footer">
    <section className="card__add-product">
      <svg
        width="26"
        height="25"
        viewBox="0 0 26 25"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M5.40193 7.84579L5.49725 8.2234H5.88672H19.25C19.8971 8.2234 20.4207 8.43756 20.8532 8.86591C21.2855 9.29402 21.5 9.81027 21.5 10.4468V10.5466L19.0564 15.6787L19.0418 15.7093L19.0314 15.7417C18.8932 16.1754 18.6372 16.5273 18.2488 16.807C17.8597 17.0873 17.4388 17.2234 16.9727 17.2234H7.77734H7.15271L7.28948 17.8329L7.37541 18.2159L7.38899 18.2764L7.41694 18.3317C7.53942 18.5743 7.71526 18.7788 7.95162 18.9192C8.18651 19.0588 8.45059 19.117 8.72266 19.117H17.4023C17.6416 19.117 17.7289 19.1761 17.7595 19.2063C17.7892 19.2357 17.8477 19.3194 17.8477 19.5532C17.8477 19.6833 17.8094 19.7656 17.738 19.8362C17.6768 19.8969 17.5831 19.9468 17.4023 19.9468H8.72266C8.23158 19.9468 7.78326 19.7988 7.36465 19.4909C6.95763 19.1914 6.68787 18.8085 6.54505 18.3288L4.44467 7.46159C4.38469 7.12915 4.23386 6.82604 3.95621 6.61356C3.68411 6.40534 3.34956 6.32979 3.00781 6.32979H0.902344C0.766702 6.32979 0.68129 6.29015 0.609644 6.2192C0.53829 6.14854 0.5 6.06628 0.5 5.93617C0.5 5.76104 0.548925 5.67072 0.609644 5.61059C0.68129 5.53963 0.766702 5.5 0.902344 5.5H3.00781C3.58716 5.5 4.0676 5.6702 4.47385 6.00355C4.88554 6.34137 5.14951 6.77361 5.26944 7.31997L5.27111 7.32759L5.27302 7.33515L5.40193 7.84579ZM18.3651 15.3543L18.375 15.3053V15.2809L20.6057 10.4876L20.6723 10.3444L20.6446 10.1889C20.5863 9.86177 20.4433 9.55898 20.1751 9.34393C19.91 9.13146 19.5831 9.05319 19.25 9.05319H6.23047H5.62667L5.73923 9.64641L6.94236 15.9868L7.01955 16.3936H7.43359H16.9727C17.2938 16.3936 17.6112 16.3279 17.8737 16.1422C18.1464 15.9493 18.3017 15.6683 18.3651 15.3543ZM10.5 23.1702C10.5 23.5494 10.3729 23.8535 10.1111 24.1128C9.84901 24.3723 9.53962 24.5 9.15234 24.5C8.80217 24.5 8.50469 24.3783 8.2366 24.1128C7.97475 23.8535 7.84766 23.5494 7.84766 23.1702C7.84766 22.791 7.97475 22.4869 8.2366 22.2276C8.50468 21.9621 8.80217 21.8404 9.15234 21.8404C9.53962 21.8404 9.84901 21.9681 10.1111 22.2276C10.3729 22.4869 10.5 22.791 10.5 23.1702ZM17.8477 23.1702C17.8477 23.5494 17.7206 23.8535 17.4587 24.1128C17.1967 24.3723 16.8873 24.5 16.5 24.5C16.1127 24.5 15.8033 24.3723 15.5413 24.1128C15.2794 23.8535 15.1523 23.5494 15.1523 23.1702C15.1523 22.791 15.2794 22.4869 15.5413 22.2276C15.8033 21.9681 16.1127 21.8404 16.5 21.8404C16.8873 21.8404 17.1967 21.9681 17.4587 22.2276C17.7206 22.4869 17.8477 22.791 17.8477 23.1702Z"
          stroke={iconColor}
        />
        <circle cx="22" cy="8" r="4" fill={iconColor} fill-opacity="0.9" />
        <path
          d="M24.964 8.064H22.684V10.284H22.144V8.064H19.864V7.548H22.144V5.316H22.684V7.548H24.964V8.064Z"
          fill="white"
        />
      </svg>
    </section>
  </article>
}

ReactDOM.render(
  <SvgCp iconColor="blue"/>,
  document.getElementById('app')
);

<div id="app"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>