在Konvajs React中绘制直线和矩形的问题

import React from 'react';
import { Stage, Layer, Line } from 'react-konva';

const App = () => {
  return (
    <Stage width={window.innerWidth} height={window.innerHeight}>
      <Layer>
        <Line
          points={[0, 0, 100, 100]} // 起点和终点的坐标
          stroke="black" // 直线的颜色
          strokeWidth={2} // 直线的宽度
        />
      </Layer>
    </Stage>
  );
};

export default App;

import React from 'react';
import { Stage, Layer, Rect } from 'react-konva';

const App = () => {
  return (
    <Stage width={window.innerWidth} height={window.innerHeight}>
      <Layer>
        <Rect
          x={20} // 矩形的左上角x坐标
          y={20} // 矩形的左上角y坐标
          width={100} // 矩形的宽度
          height={50} // 矩形的高度
          fill="red" // 矩形的填充颜色
        />
      </Layer>
    </Stage>
  );
};

export default App;