我正在使用 Konva 构建某种图像编辑器。我有一个菜单,可以在其中选择图像并将其添加到舞台上。它工作正常,直到我添加了添加多个图像的可能性。
发布代码对于任何人来说都是非常耗时的阅读,但如果有人遇到同样的问题,......
当一个元素被选中时,一个函数将一个变量 'active' 设置为 true。在再次选择相同的元素时,“活动”将设置为 false。这完美地工作,当我通过单击它周围的任何地方将元素的“活动”变量设置为 false 时,就会出现问题。
它过去只是简单地被取消选择并留在原位,但现在当我从外部取消选择它时,整个元素变得不可见。我在每个元素上也有一个“可见”属性,但它设置为 true,并且在此过程中不会改变。
1.元素onClick功能:
onClick(){
if (this.props.ElementReducer.element === null){
// console.log("There is no element selected || I´m getting selected");
this.setState({
active: true
});
this.props.selectedElement(this.state);
}else{
if (this.props.ElementReducer.element.identity == this.state.identity){
// console.log("I am already selected || I´m getting deselected");
this.setState({
active: false
});
this.props.unSelectedElement();
}else{
// console.log("Something else is selected || I´m getting selected");
this.props.prepareToUnSelectElement();
setTimeout(()=> {
this.props.unSelectedElement();
this.setState({
active: true
});
this.props.selectedElement(this.state);
},10);
}
}
}
2.外部取消选择功能:
deselectElement() {
if (this.props.ElementReducer.selectedId !== -1) {
this.props.prepareToUnSelectElement();
setTimeout(this.props.unSelectedElement, 100);
}
}
现在,即使它们中的任何一个都在更改元素的任何其他属性,并且没有调用其他函数,但我不明白为什么元素在取消选择时变得不可见。
任何想法或意见都受到好评,谢谢。
为了清楚起见,'2。外部取消选择函数”调用另一个组件中的几个函数,这些函数与“1. 元素 onClick 功能'。将 active 属性设置为 false,然后从元素的 edition reducer 文件中删除该元素。