带有儿童的 Konva 可拖动矩形

【问题标题】：Konva Draggable Rect with Children带有儿童的 Konva 可拖动矩形
【发布时间】：2020-12-22 20:26:24
【问题描述】：

我想添加一个可拖动的 Rect（下面的屏幕截图中的红色）和孩子（下面的屏幕截图中的图标和文本）。每当我尝试这个时，我都会收到此错误：

TypeError: parentInstance.add is not a function

这是尝试添加文本的代码：

<Rect x={0} y={0} width={200} height={100} draggable fill="red">              
    <Text text="Pencil" />                                                      
</Rect>

【问题讨论】：

标签： react-konva

【解决方案1】：

Rect 或其他其他 Konva 形状不能有子元素。您不能将形状嵌套到另一个形状中。对于这种情况，您需要使用Groups

<Group x={0} y={0} draggable>
  <Rect width={200} height={100} fill="red" />
  <Text text="Pencil" />                                                      
</Group>

【讨论】：

哦，太棒了！顺便说一句，我从你提供的关于 konva 的答案中记住了你的名字:)。这也是一个愚蠢的问题，但是有没有办法将普通的 React 组件放在一个组中？
如果你的意思是 DOM 组件，比如div，那么没有。