如何隐藏KONVA组中的一个元素

Question

我有一个KONVA组，其中有三个对象。我想显示/隐藏该组的一个对象。

const stage = new Konva.Stage({ 
    container: 'container', 
    width: window.innerWidth, 
    height: window.innerHeight 
}); 

const layer = new Konva.Layer(); 
stage.add(layer); 

const group = new Konva.Group(); 
layer.add(group); 

const circle1 = new Konva.Circle({ 
    x: stage.width()/2, 
    y: stage.height()/2, 
    radius: 50, 
    fill: 'green', 
    visible: true 
}); 

const circle2 = new Konva.Circle({ 
    x: stage.width()/2, 
    y: stage.height()/2, 
    radius: 30, 
    fill: 'red', 
    visible: true 
}); 

const circle3 = new Konva.Circle({ 
    x: stage.width()/2, 
    y: stage.height()/2, 
    radius: 10, 
    fill: 'blue', 
    visible: true 
}); 

group.add(circle1); 
group.add(circle2); 
group.add(circle3); 

layer.draw(); 

//group.hide(); // if I use this it will hide entire group but i want to hide only one object 
layer.draw(); 

我想只显示/隐藏Konva组的circle2。谁能帮帮我吗？

Answer 1

只需调用circle2的隐藏方法即可。

circle2.hide(); 

此circle2通过引用添加到您的组中。所以如果你在circle2中做出任何改变，它会反映在group中。