Reactjs 如何在不切断svg图像的情况下更改其大小？

以下是我用react原生svg编写的svg图像代码：

import React from "react"
import 
  { 
    widthPercentageToDP as wp ,
    heightPercentageToDP as hp
  } from "react-native-responsive-screen";
import Svg, { Rect, Path } from "react-native-svg"

export const motivImageWidth = wp('100%');
export const motivImageHeight = hp('14%');

const MotivationsView = () => {
  return (
    <Svg 
      width={motivImageWidth} 
      height={motivImageHeight} 
      viewBox={"0 0 " + motivImageWidth + " " + motivImageHeight} 
      fill="none"
    >
      <Path
        d="M195 114l5.175 5.175L205.35 114"
        stroke="#fff"
        strokeWidth={3}
        strokeLinecap="round"
        strokeLinejoin="round"
      />
      <Path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M400 0H0v90c0 8.284 6.716 15 15 15h370c8.284 0 15-6.716 15-15V0z"
        fill="#FDF5F1"
      />
    </Svg>
  )
}

export default MotivationsView

从“React”导入React
进口
{ 
宽度百分比TODP作为wp，
高度百分比TODP作为hp
}从“反应本机响应屏幕”；
从“react native Svg”导入Svg，{Rect，Path}
导出常数motivImageWidth=wp（'100%）；
导出常数motivImageHeight=hp（'14%）；
常量动机视图=（）=>{
返回(
)
}
导出默认动机视图

---

现在，我正在为我的应用程序创建自适应设计，因此我需要根据屏幕大小更改图像的大小，因此在其他设备上，我的svg图像将被切掉。如何修复此问题？

请尝试删除这两行代码：`width={motivImageWidth}height={motivImageHeight}`我这样做了，图像就消失了。我怀疑您的视图框应该是恒定的，即只有4个数字，不依赖于图像的高度/宽度。