Question

我尝试使用react-native-svg库，尤其是Symbol元素，如下所示。我在这里使用了示例代码：

    <Svg
    height="150"
    width="110"
>
    <Symbol id="symbol" viewbox="0 0 150 110" width="100" height="50">
        <Circle cx="50" cy="50" r="40" strokeWidth="8" stroke="red" fill="red"/>
        <Circle cx="90" cy="60" r="40" strokeWidth="8" stroke="green" fill="white"/>
    </Symbol>

    <Use
        href="#symbol"
        x="0"
        y="0"
    />

当我运行此代码时，我在日志中遇到以下错误，应用程序崩溃： <Error>: *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '*** -[NSRegularExpression enumerateMatchesInString:options:range:usingBlock:]: nil argument'

当我不使用Symbol对象时，一切正常。有没有人遇到过这个问题？

Answer 1

我实际上可以通过复制并粘贴此页面上的示例来解决此问题： https://developer.mozilla.org/en-US/docs/Web/SVG/Element/symbol

您需要width标记上的height和Use元素，如下所示：

<Svg height="150" width="110">
            <Symbol id="symbol" viewbox="0 0 150 110" width="100" height="50">
                <Circle cx="50" cy="50" r="40" strokeWidth="8" stroke="red" fill="red"/>
                <Circle cx="90" cy="60" r="40" strokeWidth="8" stroke="green" fill="white"/>
            </Symbol>

            <Use href="#symbol" x="0" y="0" width="100" height="50"/>
        </Svg>

我当然认为我之前尝试过，所以也可能是我运行以下清除缓存并重新编译命令： rm -rf node_modules && npm install和npm start -- --reset-cache

无论哪种方式，问题都已解决！

尝试使用＆＃34;符号＆＃34;时出现NSInvalidArgumentException来自react-native-svg库

1 个答案: