将 onPress 添加到 svg 路径时出错

如何解决将 onPress 添加到 svg 路径时出错

import React,{ useEffect,useState } from 'react';
import Axios from 'axios';
import { Text } from 'native-base';
import { SvgCss } from 'react-native-svg';

const PaintObject = ({ svg,objData }) => {
  const [color,setcolor] = useState(objData.initial_color);
  const [svgfile,setsvgfile] = useState('');

  useEffect(() => {
    Axios.get(svg).then(({ data }) => {
      setsvgfile(data);
    });
  },[]);

  if (svgfile !== '') {
    return (
      <SvgCss
        width={`${objData.width}%`}
        height={`${objData.width}%`}
        fill="grey"
        style={{
          color,position: 'absolute',top: `${objData.y}%`,left: `${objData.x}%`,}}
        xml={[...svgfile].join('').replace('currentcolor"','currentColor" onPress={() => setcolor("#000")}')}
      />
    );
  }
  return (<Text>{ }</Text>);
};

export default PaintObject;

在添加 onPress 部分后，我从上面的代码中收到此错误。有谁知道如何解决这个问题或添加 onPress 的替代方法。

错误：预期 > (8:58)。如果这是有效的 SVG，则可能是一个错误。请提出问题

        <path fill="currentColor" onPress={() => setcolor("#000")} d="M450.647 74.66c-152.612 0-276.307 123.709-276.307 276.307h232.585a43.723 43.723 0 0 1 87.445 0h232.585c0-152.598-123.71-276.307-276.308-276.307z" transform="rotate(14 -112.125 652.114) rotate(-14 175.917 551.333)"/>

解决方法

您应该使用 Pressable (React Native 0.63+) 或 TouchableOpacity。因此：

<Pressable onPress={setBlue}>
  <Svg />
</Pressable>