我有一个 react konva 项目,您可以在其中将图像加载到画布中,然后四处拖动画布。如果您加载不同的图像,则它会出现在上一张图像被拖动到的位置。我猜是否有任何方法可以重置舞台上的这个“拖动”位置(可拖动组件)。由于我正在使用反应,我唯一能想到的就是重新渲染整个组件,这现在不是问题,但我想有替代方案。
我之所以让舞台而不是图像本身可拖动,是因为我有一系列想要与图像一起移动的点。当然,我可以将点和图像都添加到组中,但这会引入一些可能不值得的复杂性。
我现在拥有的代码如下所示:
<Stage draggable width={canvasWidth} height={canvasHeight}>
<Layer ref={layerRef}>
{imageInfo.loaded && (
<Image
image={image}
onClick={addPoint}
onTap={addPoint}
width={imageInfo.targetWidth}
height={imageInfo.targetHeight}
/>
)}
{points.map((p, idx) => (
<Circle
key={pointId(p)}
x={p.x}
y={p.y}
fill={color}
radius={size}
onClick={() => setPoints(points => removePos(idx, points))}
/>
))}
</Layer>
</Stage>
皈依舞
相关分类