如何解决将 react-native-svg 从 12.3.0 升级到 13.4.0 后 fill 属性的错误?

huangapple go评论53阅读模式
英文:

How can i resolve error with fill property after upgrading react-native-svg from 12.3.0 to 13.4.0?

问题

I built React Native app, and I'm using Expo SDK 48 (requires react-native-svg@13.4.0), after I upgrade react-native-svg package to the latest version, although I use the fill property correctly, I have this strange error:

Error while updating property 'fill' of a view managed by: RNSVGPath

null

java.lang.Double cannot be cast to java.lang.String

This is my package.json:

"react": "18.2.0",
"react-dom": "18.2.0",
"react-native": "0.71.6",
"react-native-svg": "13.4.0",

This is one example of how I use the fill property:

<Svg width={12.091} height={13.098} {...props}>
  <Path
    d="M11.083 1.008H9.068V0H8.061v1.008H4.03V0H3.023v1.008H1.008A1.01 1.01 0 000 2.015v10.076a1.01  1.01 0 001.008 1.008h10.075a1.01 1.01 0 001.008-1.008V2.015a1.01 1.01 0 00-1.008-1.007zm0 11.083H1.008V5.038h10.075zm0-8.061H1.008V2.015h2.015v1.008H4.03V2.015h4.03v1.008h1.008V2.015h2.015z"
    fill={colors.gray[400]}
  />
</Svg>
<Svg width={17.811} height={17.811} {...svgProps}>
  <Path
    data-name="Path 14499"
    d="M7.132.75a6.382 6.382 0 106.382 6.382A6.382 6.382 0 007.132.75z"
    fill="none"
    stroke={color ?? colors.gray[400]}
    strokeMiterlimit={10}
    strokeWidth={1.5}
  />
  <Path
    data-name="Path 14500"
    d="M12.293 12.293l4.457 4.457"
    strokeLinecap="round"
    fill="transparent"
    stroke={color ?? colors.gray[400]}
    strokeMiterlimit={10}
    strokeWidth={1.5}
  />
</Svg>

I tried to reinstall the library and then install it again, to clear the Expo and React Native cache, I tried to use fill without a variable but with the right value for the colors, but none of that worked, I don't know what to try anymore.

英文:

I built React Native app, and I'm using Expo SDK 48 (requires react-native-svg@13.4.0), after I upgrade react-native-svg package to the latest version, although I use the fill property correctly, I have this strange error:

Error while updating property &#39;fill&#39; of a view managed by: RNSVGPath

null

java.lang.Double cannot be cast to java.lang.String

This is my package.json:

    &quot;react&quot;: &quot;18.2.0&quot;,
    &quot;react-dom&quot;: &quot;18.2.0&quot;,
    &quot;react-native&quot;: &quot;0.71.6&quot;,
    &quot;react-native-svg&quot;: &quot;13.4.0&quot;,

This is one example of how I use the fill property:

&lt;Svg width={12.091} height={13.098} {...props}&gt;
      &lt;Path
d=&quot;M11.083 1.008H9.068V0H8.061v1.008H4.03V0H3.023v1.008H1.008A1.01 1.01 0 000 2.015v10.076a1.01  1.01 0 001.008 1.008h10.075a1.01 1.01 0 001.008-1.008V2.015a1.01 1.01 0 00-1.008-1.007zm0 11.083H1.008V5.038h10.075zm0-8.061H1.008V2.015h2.015v1.008H4.03V2.015h4.03v1.008h1.008V2.015h2.015z&quot;
        fill={colors.gray[400]}
      /&gt;
&lt;/Svg&gt;
&lt;Svg width={17.811} height={17.811} {...svgProps}&gt;
      &lt;Path
        data-name=&quot;Path 14499&quot;
        d=&quot;M7.132.75a6.382 6.382 0 106.382 6.382A6.382 6.382 0 007.132.75z&quot;
        fill=&quot;none&quot;
        stroke={color ?? colors.gray[400]}
        strokeMiterlimit={10}
        strokeWidth={1.5}
      /&gt;
      &lt;Path
        data-name=&quot;Path 14500&quot;
        d=&quot;M12.293 12.293l4.457 4.457&quot;
        strokeLinecap=&quot;round&quot;
        fill=&quot;transparent&quot;
        stroke={color ?? colors.gray[400]}
        strokeMiterlimit={10}
        strokeWidth={1.5}
      /&gt;
&lt;/Svg&gt;

I tried to reinstall the library and then install it again, to clear the Expo and React Native cache, I tried to use fill without a variable but with the right value for the colors, but none of that worked, I don't know what to try anymore.

答案1

得分: 1

我升级到了v12.5.1,它仍在工作。没有升级的必要。它仍然运行良好。Expo医生只抛出了一个警告。

英文:

I upgraded it to v12.5.1 It is still working. There is no reason to upgrade. It still works well. The Expo doctor throw a warn only.

huangapple
  • 本文由 发表于 2023年4月6日 22:08:31
  • 转载请务必保留本文链接:https://go.coder-hub.com/75950483.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定