如何在 ReactJS 中调整 SVG 的大小以填充其容器？

我们可以使用 type 属性调整 SVG 的大小以填充 ReactJS 中的容器。我们可以将以下样式添加到 SVG

CSS 语法：

svg {
 width: inherit;
 height: inherit;
}

反应语法：

创建反应应用程序：

第 1 步：使用以下命令创建一个 React 应用程序：

npx create-react-app foldername

第 2 步：创建项目文件夹（即文件夹名称）后，使用以下命令移动到该文件夹：

cd foldername

项目结构：它将如下所示。

项目结构

App.js：现在在 App.js 文件中写下以下代码。在这里，App 是我们编写代码的默认组件。

Javascript

import { React, Component } from "react";
  
class App extends Component {
  
  render() {
    return (
      <>
        

          
        
        

        

          
        
      
    );
  }
  
}
  
const MySvg = (props) => {
  return (
    // With Styling
    
  );
}
  
export default App

运行应用程序的步骤：从项目的根目录使用以下命令运行应用程序：

npm start

输出：

• 在应用样式道具之前，以下将是输出：
• 应用样式道具后，输出如下：