<View> </View>不支持在React Native iOS的<Svg> </Svg>内部

Question

在iOS和Android的in react native内部无法正常工作。已经使用过“ react-native-svg”：“ 9.5.1”，只是想知道平台兼容性还是svg插件版本问题。

render（）{

const {
  mainContainer,
  contentContainer,
  mainTextStyle
} = styles

return (
  <View style={ mainContainer }>
    <View style={ contentContainer }>
      <Svg width="100%" height="100%" viewBox="0 0 400 750">

        <Rect x="50" y="10" width="350" height="600" fill="red"/>
        <Rect x="50" y="260" width="250" height="350" fill="yellow"/>
        <Rect x="50" y="360" width="200" height="250" fill="green"/>
        <Rect x="50" y="510" width="100" height="100" fill="purple"/>

        <Text x="60" y="50" style={ mainTextStyle }>High</Text>
        <Text x="60" y="300" style={ mainTextStyle }>Pre-High</Text>
        <Text x="60" y="400" style={ mainTextStyle }>Ideal</Text>
        <Text x="60" y="550" style={ mainTextStyle }>Low</Text>

        { this.renderAxes() }

      </Svg>
    </View>
  </View>
)

}

///////////////////////////////////////////////// ///

renderAxes =（）=> {

const {
  contentContainer,
  mainTextStyle
} = styles

// yAxis coordinates and yLabel
const yText = [190, 180, 170, 160, 150, 140, 130, 120, 110, 100, 90, 80, 70]
const yTextXCoordinate = 5
const yTextYCoordinate = 15
const yLineXCoordinate = 40
const yLineYCoordinate = 10

// JSX for yAxis and yLabel
const yAxis = yText.map((ylabel, index) => {

  const currentTextYCoordinate = yTextYCoordinate + (index * 50)
  const currentLineYCoordinate = yLineYCoordinate + (index * 50)

  return (
    <View key={ index }>
      <Text x={ yTextXCoordinate } y={ currentTextYCoordinate } style={ mainTextStyle }>{ ylabel }</Text>
      <Line x1={ yLineXCoordinate } y1={ currentLineYCoordinate } x2={ yLineXCoordinate + 10 } y2={ currentLineYCoordinate } stroke="black"/>
    </View>
  )
})

}