loading
正在被设置并传递到 props 中,但是当在任何按钮上按下 onClick
时,加载程序会在 item
abgefeuert. Wie kann ich dafür sorgen, dass der Lader nur bei gedrückten Tasten läuft?
List.map((item, i) => { return( <Button onClick={(e) => !props.loading && e.stopPropagation()}> Save {props.loading && (<CircularProgress/>)} </Button> ); });
您必须使用 Id 数组来呈现每个按钮中的加载,而不是在父组件中加载布尔变量。这是一个例子: 您可以在代码沙箱中检查此代码 在这里。
这是我实现的一个简单示例。如果用户单击某个按钮,则只有该按钮才会呈现加载微调器。您可以通过多种方式实现它。如果用户单击加载按钮,您还可以添加逻辑以通过检查状态中是否存在该项目来删除加载。如果是,您只需将其从加载列表中删除即可。